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适用 于 砌 念 网 站 开 友 新 手 


@ 本 书 由 资深 网 站 设计 师 编著 ， 包 含 大 量 精美 实用 的 商业 应 用 实例 。 本 书 内 容 及 版 
式 设计 新 颖 ， 知 识 与 实例 相 结 合 ， 以 图 解 为 主 ， 充 分 提高 学 习 效 率 。 

@ 本 书 采用 最 新 的 div+CSS 网 页 布局 ，7 个 网 站 常用 动态 系统 的 设计 与 开发 案例 ， 
读者 无 须 掌握 烦琐 的 编程 技巧 ， 即 可 巧妙 利用 Dreamweaver CS5 的 服务 器 行为 
实现 各 种 动态 系统 的 开发 与 建设 。 

全 附 赠 精 彩 多 媒体 光盘 ， 并 配备 全 程 语音 讲解 及 字幕 ， 从 视觉 、 听 觉 全 方位 引导 读 
者 轻松 愉快 地 学 习 。 


i mm) を に 
INE PRESS 





NEO OOOO EON 


Dreamweaver CS5+ASP [| 日 日 | 


HHHHHHHL 
日 2 


环 博 文化 组 编 


陈 益 材 ”等 编著 


0 


机 械 工 业 出 版 社 





本 书 是 一 本 关于 动态 网 站 开发 的 技术 图 书 ， 专 门 为 初次 接触 动态 网 站 
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記 
动态 网 站 的 服务 器 技术 有 很 多 种 ，ASP 是 应 用 最 广泛 的 一 种 。 动 态 网 站 开发 的 工具 也 有 
Dreamweaver CS5 工具 结合 
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起 来 建立 动态 网 站 能 够 达到 事半功倍 的 效果 。 


很 多 种 ， 而 Dreamweaver CS5 是 最 受 欢 迎 、 易 用 性 最 高 的 一 种 。 把 ASP 技术 和 
本 书 从 基本 的 网 站 建设 入 门 知 识 开 始 讲解 ， 循 序 渐进 地 发 展 到 专业 网 站 建设 经 验 ， 紧 扣 
商业 应 用 实例 ， 引 导读 者 一 步 步 成 为 动态 网 站 建设 的 高 手 。 全 书 的 内 容 与 结构 如 下 : 

第 1 革 从 动态 网 站 建设 的 前 期 准备 工作 入 手 ， 通 过 资深 设计 师 的 经 验 诠 释 ， 帮 助 读者 党 
所 动态 网 站 建设 的 核心 设计 思路 。 
搭建 方法 。 











与 建设 。 











第 2 半 讲 解 现在 通用 的 Web 2.0 标准 静态 网 页 的 搭建 方法 ， 让 该 者 快速 学 握 静 态 页 面 的 


第 3 一 9 章 ， 每 草 介 绍 一 种 动态 网 站 建设 的 核心 技术 。 分 别 介 绍 了 用 户 管 理 系统 、 留 言 
板 系统 、 新 闻 系 统 、 投 票 系统 、 论 坛 系统 、 博 客 系统 以 及 网 络 购物 系统 7 个 大 型 系统 的 开 友 
其 目的 是 使 读者 在 学 完 本 书后 ， 能 够 通过 Dreamweaver CSS 建立 Web 应 用 程序 ， 
并 在 此 基础 上 构建 带 有 Access 数据 库 的 大 型 网 站 。 

第 10 草 重 点 介绍 搜索 引擎 优化 的 知识 ， 包 括 SEO 基础 知识 

的 企业 网 站 SEO 方案 以 及 选择 企业 关键 字 的 重要 性 等 内 容 ， 帮 助 谈 者 掌握 搜索 引擎 网 站 优 
化 的 技术 。 

人 


与 其 他 相关 似 的 计算 机 图 书 相 比 ， 本 书 上 其 有 以 下 儿 点 特色 : 
识 入 手 





搜索 引擎 基础 、 设 计 正 确 
， 傈 要 
网 页 排版 制作 等 内 容 。 








当 本 书 以 学 习 Web 设计 和 网 站 建设 为 目的 ， 从 网 页 制作 技术 和 网 页 制作 工具 的 基础 知 


地 介绍 了 当今 流行 的 Web 制作 工具 和 技术 ， 包 括 网 站 开发 技术 、 图 像 处 理 和 
ei 
以 独立 制作 网 站 的 目的 。 








让 附 送 光 意 中 噌 送 本 毛 実 例 的 多 媒 体 教 学 光 昔 
材 ， 是 学 习 动 态 网 站 建设 的 最 佳 素 材 宝 典 。 








并 本 书 定位 在 基础 与 提 局 上 ， 在 深入 浅 出 、 通 俗 易 情 的 基础 上 ， 强 调 介绍 知识 的 系统 
性 和 制作 技巧 的 实用 性 。 不 仅 使 读者 能 顺利 入 门 ， 还 可 以 使 读者 有 一 定 程 度 的 提高 ， 达 到 可 





排 合理 ， 注 重 实用 性 与 可 操作 性 。 


本 书 由 具有 10 年 网 站 建设 实战 经 验 的 资深 设计 师 编 写 ， 理 论 与 实践 相 结 合 ， 革 六 
生 
季 
王 新 权 、 








同时 附 赠 所 用 网 站 实例 源 代 码 及 素 
于 倚 云 等 编号 。 
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动态 网 站 开发 是 网 站 建设 的 一 项 核心 工作 。 动 态 网 站 开发 简单 地 说 束 是 实现 动态 的 提取 和 更 
新 网 站 数据 的 操作 ， 采 用 动态 提取 、 存 储 网 站 数据 的 网 站 开发 技术 一 般 统称 为 动态 网 站 开发 技 
术 。 目 前 较为 普及 的 动态 网 站 开发 语言 有 ASP、ASPNET、PHP、JSP 等 , ASP 是 一 种 应 用 非常 
三 泛 的 动态 网 页 开发 技术 。 本 书 就 是 围绕 如 何 利 用 Dreamweaver CS5+ASP 平台 进行 网 站 开发 展开 
的 。 本 章 将 介绍 关于 动态 网 站 开发 建设 的 基础 知识 。 
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动态 网 站 基础 知识 





网 页 制作 撤 术 的 发 展 日 新 月 异 ， 对 从 事 网 站 开发 与 建设 的 设计 师 来 说 这 是 竺 运 的 ， 
为 能 够 在 网 络 上 更 好 地 设计 目 己 的 作品 ， 但 同时 又 是 羊 吉 的 ， 因 为 需要 不 断 地 学 习 和 笃 握 
狐 技 术 。 








静态 与 动态 网 站 的 区 别 


网 站 的 开发 是 一 项 系统 性 的 工作 ， 首 先 要 经 过 平面 设计 师 使 用 平面 设计 软件 如 
Photoshop 制作 出 页 和 面 的 锥 形 ， 再 由 网 页 设计 师 使 用 网 页 设计 软件 如 Dreamweaver 软件 进行 
静态 页 面 的 排版 ， 最 后 由 网 页 程序 员 使 用 不 同 的 编程 方法 完成 各 功能 模块 的 开 有 发。 大体 上 制 
作 一 个 动态 网 站 需要 制作 项 态 的 网 页 和 开发 动态 的 网 页 两 个 关键 环节 。 下 面 首 先 来 介绍 一 下 
“静态 ”和 “动态 ”网 页 的 基本 概念 。 

上 所谓“ 静态” 指 的 驶 是 网 站 的 网 页 内 容 “ 固 定 不 变 ”， 当 用 户 浏览 右 通 过 互联 网 的 
HTTP (Hypertext Transport Protocol) 协议 问 Web 服务 器 请 求 提供 网 页 内 容 时 ， 服 务 右 仪 仪 
是 将 已 经 设计 好 的 静态 HIML 文 梢 传送 到 用 户 浏 览 器 。 其 页 面 内 容 使 用 的 是 标准 的 HTML 
代码， 最 多 再 加 上 一 些 GIF 格式 的 効 画 関 片 。 

“动态 ”网 页 最 主要 的 作用 在 于 可 以 让 用 户 通过 浏览 堪 访 问 、 管 理 和 利用 存储 在 服务 需 
上 的 资源 和 数据 ， 特 别 是 数据 库 中 的 数据 。 因 此 ， 利 用 “项 态 ” 页 面具 能 构建 单纯 的 供 显 示 
预 设 信息 的 网 页 ， 而 利用 “动态 ”网 页 则 可 以 构建 复杂 的 、 可 以 用 来 进行 数据 操作 的 、 基 于 
浏览 如 的 Web 应 用 程序 。“ 动 态 ” 网 页 不 仅 能 够 癌 用 户 显 示人 他们 所 需要 的 信息 ， 而 且 可 以 让 
用 户 根 据 需 要 对 这 些 信息 进行 处 理 。 


| 动态 网 站 开发 技术 


目前 , 最 常用 的 4 种 动态 网 页 开发 语言 有 ASP (Active Server Page)、ASPNET (Active 
Server Page .NET)、JSP (Java Server Page) 和 PHP (Hypertext Preprocessor)。 那 么 这 4 种 程 
序 各 有 什么 优 缺 后 ， 我 们 学 习 哪 一 种 语言 更 容易 上 和 手 呢 ?下 面 束 让 我 们 一 起 来 了 解 一 下 这 4 
种 技术 的 特点 。 

国 ASP 的 特点 

ASP 使 用 VBScript、JavaScript 等 简单 易 懂 的 脚本 语言 ， 结 合 HTML 代 人 码 ， 即 可 快速 地 
完成 网 站 的 应 用 程序 。ASP 程 序 无 须 compile 编 译 ， 可 在 服务 器 端 直接 执行 ， 使 用 普通 的 文 
本 编辑 费 ， 如 使 用 Windows 的 记事 本 ， 即 可 进行 编辑 设计 。ASP 程 友 与 浏览 右 无 天 ， 客 刻 
端 只 要 使 用 可 执行 HTML 码 的 浏览 器 ， 即 可 浏览 用 ASP 语 言 所 设计 的 网 页 内 容 。ASP 所 使 
用 的 脚本 语言 均 在 Web 服务 器 痛 执 行 ， 客 户 病 的 浏览 右 不 需要 执行 这 些 脚 本 语言 。ASP 能 
与 任何 ActiveX 脚 本 编程 语言 兼容 。 除 了 可 使 用 VBScript 或 Java Script 语言 设计 外 ， 还 可 以 
通过 plug-in 的 方式 ， 使 用 由 第 三 方 提供 的 其 他 脚本 语言 ， 如 REXX 语 言 、Perl 语 言 和 Tcl 语 
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言 等 。 脚 本 引擎 是 处 理 脚本 程序 的 COM (Component Object Model) 对 象 ， 可 使 用 服务 器 端 
成 客 所 端的 脚本 。 

ASPNET 的 特 点 

ASPNET 彻 展 抛弃 了 脚本 语言 ， 用 C# 或 VB 编写 ， 为 开发 者 提供 了 更 加 强 有 力 的 编程 > 
资源 ， 人 允许 用 服务 器 控件 取代 传统 的 HTML 元 素 ， 而 且 代码 与 界面 分 开 。 

ASPNET 不 是 ASP 的 简单 升级 ， 而 是 Microsoft 推出 的 一 种 新 的 计算 平台 ， 它 简化 了 在 
高度 分 布 式 Internet 环境 中 的 应 用 程序 开发 。 其 全 狐 的 技术 架构 会 让 每 个 用 户 的 编程 变 得 更 
加 简单 。 

国 PHP 的 特点 

PHP 是 一 种 跨 平 台 的 服务 右 新 散 入 式 脚 本 语言 。 它 大 量 地 借用 C、Java 和 Perl 语言 的 语 
法 ， 并 结合 PHP 自己 的 特性 , 使 Web 开发 者 能 够 快速 地 写 出 动态 页 面 。 它 文 持 目前 绝 大 多 
数 数据 库 。 另 外 ，PHP 是 完全 免费 的 ， 可 以 从 PHP 官方 站 点 目 由 下 载 得 到 ， 而 且 用 户 可 以 
不 受 限 制 地 获得 源 代码。 

PHP 可 以 编 诺 成 具有 与 许多 数据 库 相 连接 的 函 数 ， 用 户 还 可 以 目 己 编写 外 围 的 函数 从 
而 间接 存 取 数据 库 。 通 过 这 样 的 途径 在 更 换 使 用 的 数据 库 时 ， 可 以 轻松 地 修改 编码 以 适应 
这 样 的 变化 。 但 PHP 提供 的 数据 库 接口 文 持 不 统一 ， 如 对 Oracle、MySQL 和 Sybase 的 接 
口 ， 彼 此 都 不 一 样 ， 这 也 是 PHP 的 一 个 需要 完善 的 地 方 。 

国 JSP 的 特点 

JSP 是 Sun 公司 推出 的 网 站 开发 语言 。JSP 可 以 在 Serverlet 和 JavaBean 的 文 持 下 ， 完 成 
功能 强大 的 站 点 程序 。 

使用 JSP 技术 ， 开 发 人 员 可 以 使 用 HTML 或 者 XML 标识 来 设计 和 格式 化 最 终 页 面 ， 使 
用 JSP 标识 或 者 小 脚本 来 产生 页 面 上 的 动态 内 容 。 产 生 内 容 的 迪 辑 被 封装 在 标识 和 
JavaBeans 和 群 组 件 中 ， 并 且 捆 绑 在 小 脚本 中 ， 所 有 的 脚本 在 服务 器 病 执 行 。 如 果 核 心 人 逻辑 被 
封 儿 在 标识 和 Beans 中 , 那 久 其他 人 , 如 Web 管理 人 员 和 页 面 设 计 者 ， 能 够 编辑 和 使 用 JSP 
页 面 ， 而 不 影响 内 容 的 产生 。 在 服务 右 疡 ，JSP 引擎 解释 JSP 标识 ， 产 生 所 请 求 的 内 容 〈 例 
如 ， 通 过 存 取 JavaBeans 群 独 件 , 使用 JDBC 技术 存 取 数 据 库 )， 并 且 将 结果 以 HIML (或 者 
XML) 页 面 的 形式 发 送 回 浏览 占 。 这 既 有 助 于 作者 你 护 目 己 的 代码 ， 而 叉 保 证 页 面 在 任何 基 
于 HTML 的 Web 浏览 器 完全 可 用 。 

目前 在 国内 ASP 与 PHP 应 用 最 为 广泛 。 而 JSP 虽然 在 国内 采用 的 较 少 ， 但 在 国外 已 经 
是 比较 流行 的 一 种 技术 ， 尤 其 是 电子 商务 关 的 网 站 ， 多 采用 JSP。 

ASP、ASPNET、PHP 和 JSP 四 者 都 有 相当 数量 的 用 户 。 正 在 学 习 或 使 用 动态 页 面 
的 朋友 可 根据 四 者 的 特点 选择 一 种 适合 上 自己 的 语言 。 本 书 是 为 初 、 中 级 网 站 建设 者 学 习 
建设 动态 网 站 而 编写 的 ， 我 们 推荐 谈 者 选择 ASP 技术 学 习 。 
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ASP 网 站 的 工作 方式 和 流程 



































进行 ASP 网 页 开发 之 前 ， 首 先 必 须 配置 运行 ASP 网 页 所 需 的 软件 环境 ， 只 有 配置 了 运 
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行 环 境 后 ASP 网 站 才能 正常 运行 。 本 节 将 重点 介绍 ASP 网 站 的 工作 方式 和 流程 。 
动态 网 页 的 工作 方式 


一 个 ASP 动态 网 站 通 销 包括 静态 页 面 和 动态 页 面 。 动 态 页面 与 静态 页 面 之 间 的 区 
别 是 运行 脚本 的 位 置 不 同 ， 动 态 页 和 面 需要 通过 调用 数据 库 在 服务 占 上 运行 ， 而 静态 页 表 
的 脚本 不 能 在 服务 器 上 运行 。 其 他 方面 两 者 比较 类 似 ， 例 如 这 两 种 页 面 都 可 以 使 用 
VBScript 或 JavaScript 脚本 语言 ， 且 都 存放 在 服务 器 上 ， 运 行 的 时 候 都 提交 给 Web 浏览 
Yo 

在 服务 器 上 运行 的 程序 称 为 脚本 或 服务 器 问 的 脚本 ， 可 以 使 用 数据 库 等 多 种 网 络 资源 。 
在 Dreamweaver CSS 中 ， 服 务 器 端的 脚本 称 为 服务 行为 。 一 个 Web 页 面 在 提交 给 浏览 器 之 
表 ， 服 务 咒 问 的 脚本 可 以 上 肥 指 令 给 服务 器 ， 服 务 器 根据 指令 的 具体 内 容 从 数据 库 中 提取 合适 
的 数据 ， 并 把 这 些 数据 插入 到 动态 页 面 中 ， 插 入 完成 后 再 提交 给 浏览 器 。 

在 网 页 中 可 以 包含 各 种 程序 ， 有 些 程 序 在 用 户 的 浏览 器 中 运行 ， 而 有 些 程序 则 在 Web 
服务 右上 运行 。 包 含 了 Web 服务 器 上 运行 脚本 程序 的 网 页 则 被 称 为 “交互 式 网 页 ”。 

交互 式 网 页 的 最 大 应 用 在 于 Web 数据 库 系 统 。 当 脚本 程序 访问 Web 服务 器 闹 的 数据 库 
时 ， 将 得 到 的 数据 转变 为 HTML 代码 ， 并 友 送 给 客户 器 的 浏览 右 ， 客 户 站 的 浏览 右 瓯 显示 
出 数据 库 中 的 数据 。 当 用 户 需 要 将 数据 写 入 数据 库 时 ， 可 填写 在 网 页 的 表单 中 ， 友 壕 给 浏览 
器 ， 然 后 由 脚本 程序 将 其 写 入 到 数据 库 中 。Web 数据 库 系 统 的 工作 过 程 如 图 1-1 所 示 。 Web 
数据 库 系统 是 Web 与 传统 数据 库 系 统 的 完美 结合 ， 与 传统 Web 系统 相 比 ， 它 的 信息 来 目 数 
据 库 ， 页 面 信息 会 随 数据 库 的 更 新 而 更 新 。 
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图 1-1 Web 数据 库 系统 的 工作 过 程 示意 


| ASP 动 态 网 页 的 工作 流程 


建设 一 个 ASP 动态 网 站 之 前 ， 需 要 进行 策划 和 准备 工作 。 策 划 工 作 主 要 指 事先 要 设计 
好 网 站 的 结构 ， 而 准备 工作 主要 指 事先 要 准备 好 网 站 的 域名 、 衬 间 并 设计 好 网 站 的 VI〔 网 
页 视 沉 效果 设计 )。 然 后 丈 古 网 站 的 设计 实现 ， 最 后 古 网 站 的 维护 与 推广 工作 。 其 中 网 站 设 
计 实 现 的 工作 流程 如 下 : 
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国 安装 Web 服务 器 程序 

本 书 以 IIS 作为 Web 服务 器 程序 。 一 旦 安装 了 Web 服务 器 程序 ， 束 相当 于 将 计算 机 设 
置 成 为 一 台 真 正 的 Internet 服务 器 ， 所 以 只 需 局 动 浏览 器 ， 并 在 地 址 栏 中 输入 映射 站 点 的 地 
址 ， 就 可 以 进行 系统 、 细 致 的 测试 ， 一 切 就 像 访 问 真正 的 站 点 一 样 。 在 利用 浏览 器 测试 之 他) 
余 ， 可 能 还 需要 对 代码 进行 编辑 。 

加 建立 静态 网 页 

动态 网 页 是 一 种 交互 式 网 页 ， 所 有 的 交互 式 网 页 ， 都 来 自 于 静态 网 页 。 因 此 在 建立 数据 
库 网 页 时 需要 建立 一 个 静态 网 页 。 这 个 静态 网 页 要 与 其 他 的 网 页 一 样 ， 包 含 静 态 文字 、 图 
片 、 动 画 、 超 级 链接 、 按 钮 以 及 表单 等 。 

回 建立 数据 库 

实质 上 ， 动 态 网 页 就 是 一 个 可 以 访问 数据 库 的 网 页 。 在 建立 数据 库 网 页 前 ， 要 建立 一 个 
数据 库 。 在 建立 数据 库 时 ， 还 要 根据 项 目的 具体 要 求 设计 数据 库 的 结构 。 本 书 采 用 的 是 入 门 
级 的 Access 数据 库 。 

加 加 入 动态 网 页 技术 

动态 网 页 是 通过 在 静态 网 页 中 加 入 ASP 代码 或 使 用 其 他 动态 网 页 技术 访问 数据 库 ， 将 
数据 库 中 的 数据 显示 在 网 页 中 或 将 网 页 中 的 数据 记录 到 数据 库 中 。 最 后 还 需要 调试 应 用 程 
序 。 对 于 Web 应 用 程序 来 说 ， 所 谓 运 行 ， 就 是 利用 浏览 器 打开 它 ， 对 于 传统 的 静态 页 面 文 
件 ， 也 即 带 有 .html 文件 扩展 名 的 文件 来 说 ， 直 接 用 浏览 器 打开 它 就 可 以 完成 测试 ， 但 是 对 
于 动态 页 面 ， 即 带 有 .asp 等 文件 扩展 名 的 页 面 文件 来 说 ， 必 须 将 它们 放 入 真正 的 Web 站 点 ， 
才能 进行 测试 ， 直 接 用 浏览 器 打开 它 是 不 行 的 。 

在 Dreamweaver CSS 中 建立 数据 库 网 页 的 过 程 大 致 相同 ， 有 基体 步骤 如 下 : 

分 析 动 态 网 站 的 要 求 ， 建 立 合适 的 数据 库 。 

定义 网 站 站 点 。 

创建 静态 网 页 。 

创建 数据 源 。 

创建 数据 链接 。 

创建 数据 集 。 

在 网 页 中 添加 服务 器 端 行为 。 

调试 数据 库 网 页 并 发 布 使 用 。 


看 建立 本 地 服务 器 

































































Dreamweaver CSS 无 法 独立 创建 动态 网 页 ， 必 须 建 立 一 个 Web 服务 器 环境 和 数据 奋 运行 环 
境 。 Dreamweaver CSS 支持 ASP、JSP、Cold Fusion 和 PHP 4 种 服务 器 技术 ， 在 使 用 Dreamweaver 
CSS 之 前 逢 要 选 定 一 种 技术 。 本 书 选 用 的 是 最 第 用 的 ASP 服务 需 技 术 ， 即 使 用 ASP 编写 脚本 话 
句 。 选 择 ASP 服务 器 技术 ， 则 必须 安装 文 持 ASP 的 网 站 服务 器 ITS 。 
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进行 ASP 网 页 开发 之 前 ， 首 先 必 须 安装 编译 ASP 网 页 所 需要 的 软件 环境 。IIS 是 由 微 
软 公 司 开 发 、 以 Windows 操作 系统 为 平台 、 运 行 ASP 网 页 的 网 站 服务 器 软件 。IIS 内 建 有 
ASP 的 编译 引擎 ， 在 设计 网 站 的 计算 机 上 必须 安 北 IS 才能 测试 ASP 网 页 ， 在 Dreamweaver 
CS5 中 创建 ASP 文件 前 ， 同 样 必须 安装 IIS 并 创建 虚拟 网 站 。IIS 本 身 提供 各 衝 Internet 服 
务 ， 例 如 可 供 文 件 传输 的 FTP 协议 、 发 送 电 子 邮件 的 SMTP 协议 及 网 页 浏览 的 网 站 服务 
等 ， 这 些 服务 在 “Internet 信息 服务 ”窗口 中 以 目录 的 方式 分 类 。 当 用 户 利用 IIS 创建 网 
站 时 ， 所 有 的 网 页 都 必须 放 在 “网 站 ”这 个 特定 的 目录 中 。IIS 根据 指定 的 网 址 对 应 路 
径 ， 将 其 中 的 文件 或 子 目 录 对 应 到 计算 机 中 存储 网 页 文件 的 真正 位 置 。 当 用 户 通过 浏览 
器 浏览 网 页 时 ，IIS 根据 其 指定 的 网 址 取出 对 应 的 文件 ， 解 析 后 再 通过 Internet 传送 至 用 
户 计算 机 的 浏览 器 上 。 


对 于 操作 系统 Windows Server 2003 或 者 Windows XP Professional 而 言 ， 系 统 已 经 默 
认 安 装 了 IIS。 下 面 以 Windows XP Professional 为 例 ， 介 绍 如 何 安 装 IIS 服务 器 ， 其 具体 
步骤 如 下 : 

将 Windows XP Professional 系统 安装 光盘 搬入 光盘 张 动 器 中 。 

选择 “开始 ”有 末 蛙 中 的 “设置 ”一 “控制 面板 ”命令 ， 打 开 “ 探 制 面板 ”， 在 “ 控 
制 面 板 ” 中 双击 “ 瀛 加 或 删除 程序 ”， 打 开 “ 添 加 或 删除 程序 ”对 话 框 ， 如 图 1-2 所 示 。 


E31 
































当前 实 装 的 程序 : 口 、 显 示 更 新 0) 排序 方式 GS): | 名 称 





篇 kdobe Creative Suite 3 Design Premium {zh CH} 大 小 159 00W 上 
单 击 此 处 敬 香 专 持 信息 。 已 使 用 很 少 
上 次 使 用 日 期 2008-2-20 
Ea 
Dw Adobe Dreamweaver CS3 忧 化 版 大小 274. ロ nME 
六 Adobe Dreamweaver CS4 大小 ”274. 00MB 
hdobe Dreamweaver CS4 大 小 ”15. 55MB 
EE Adobe Flash CS3 Professional 大 小 。 44.28MBE 
9 hdobe Flash Flayer 9 ActiveX 大 小 2.BEME 


@ Adobe Flash Flayer 9 Flugin 太 小 2.53ME 


時 hAdobe Flash Flayer ActiveX 

Ea Adobe Fhotoshop CS3 

pa hAdobe Reader 8.1.0 - Chinese Simplified 大 小 193.00WB 

如 ApplLe Software Update 大 小 2 41ME 

六 ATI Display Driver 

= Cool Edit Fro 2.1 太 小 25.13ME 
©) Cors1DRAW Graphics Suite X3 ーー 大 小 _4n3_nnMR 半 





图 1-2 “添加 或 删除 程序 ”对 话 框 











第 1 音 名目 村 及 加 下 区 十 过 fr 








从 左 侧 列表 中 选择 “添加 /删除 Windows 组 件 ”按钮 总 ， 打 开 如 图 1-3 所 示 的 
对 话 框 。 
单 击 选 中 “Internet 信息 服务 〈IHS)” 复 选 枉 ， 然 后 单 击 “ 详 细 信 息 ” 鬼 
钮 ， 打 开 如 图 1-4 所 示 的 对 话 框 ， 从 中 选中 需要 安装 的 Windows 组 件 的 复 选 框 ， 建 议 他) 
选中 所 有 的 组 件 。 单 击 “ 确 定 ” 按 钮 后 ， 返 回 图 1-3 所 示 对 话 框 。 WA 
单 击 “ 下 一 步 ”按钮 ， 如 果 安 装 需要 从 Windows 光盘 复制 文件 ， 将 打开 如 ”二 
1-5 所 示 的 “Windows ”组 件 同 村” 和 安 状 进 度 对 话 框 。 











Windows 组 忻 向 导 Internet 信息 服务 (IIS) 


Tindors IN 了 e 月 本 ER Es 
加除 Windows XP 的 组 件 。 可 六 加 结 由 隆基 由 Es 灰色 框 表示 只 会 安装 该 组件 的 
Tntsrnet 信息 服务 (TIS) 的 子 租 件 上 E): 

cv FrontPage 2000 服务 器 扩展 

人 Internet 信息 服务 管理 单元 1.3 ME 
SMTF Service 3.B ME 
公用 文件 1.0 ME 
ツ | Trternet Explorer 『 万维网 服务 2.3 ME 
四 *g Internet 恒 息 服务 (IIS) | 地 文档 本 3.5 ME Z| 
| WO NSH Explorer 11.8 ME i | 
四 調 0at1ook Fxxpress nn MB | 描述 : 使用 Microsoft FrontPags 和 Visual InterDev 来 创作 和 管理 站 点 





要 添加 或 册 除 某 个 组 件 ， 请 单 击 旁边 的 复 选 租 。 克 包 答 表 示 和 会 安装 该 组 件 的 
一 部 分 。 归 查看 组 件 内 容 ,请 单 击 “ 详 细 信 息 ” 


组 件 CC): 

















| 四 国 网 网 网 

















描述 : 包括 Web 和 FTP 支持 ， 以 及 对 FrontPage、 事 劳 处 理 、Active 
Server Fages 和 数据 库 连 接 的 支持 。 


所 需 磁 盘 空间 : 57.6 MB っ 
可 用 磁盘 空间 : 4141.1 ME or 4 りー 所 需 磁 盘 空 间 : 57.6 ME 


可 用 磁盘 空间 : 4140.5 ME 





图 1-3 “添加 /删除 Windows 组 件 ” 对 话 框 图 1-4 “Intemet 信息 服务 (IS) ”对 话 框 





安装 完成 后 ， 将 打开 “Windows 组 件 向 导 ” 安 装 完成 对 话 框 ， 如 图 1-6 所 
示 ， 单 击 “ 完 成 ”按钮 ， 则 完成 设置 。 





Windows 组 件 癌 导 


正在 配置 组 件 
实 装 程序 正在 根据 您 的 请 求 ， 进 行 配置 更 改 。 


Windowsz 组 御 癌 导 
完成 “Windows 组 件 向 导 ” 


店 選 成功 地 玩 万 了 Windorws 姐 件 向 导 。 


动 请 稍 候 ， 安 装 程序 正在 配置 蛤 件 。 所 花 时 间 取 决 于 选 定 的 组件。 


状态 : ”正在 完成 附件 和 工具 的 配置 .. . 


[aaa | 


清单 击 “ 充 成 ”来 关闭 此 向 导 ， 








图 1-5 ”安装 进度 对 话 框 图 1-6 安装 完成 对 话 框 





默认 状态 下 ，IIS 将 被 安装 到 C 驱动 左下 的 Inetpub 目录 中 ， 其 典型 安装 时 的 目录 结构 如 
图 1-7 所 示 。 其 中 有 一个 名 为 “wwwroot” 的 文件 夹 ， 它 是 浏览 访问 的 默认 目录 ， 访 问 的 默 
认 Web 站 点 也 放置 在 这 个 文件 夹 中 。 














BM Tnetpnub 
: 立件) 编辑 人 于) 查看 属 ) 収 立 ぬ ) 工具 他) 大助 出) 


Ou ©-S の | 居 人 国 :- 


: 地 址 凹 ) Bc:\Inetpub 














田 吉 3.5 软盘 以 :) 

日 swe 本 地 磁盘 (C:) 
由 | 当 CCProxy = 
ヨロ Documents and Set 








图 1-7 IIS 安装 的 文件 夹 


Te 配置 网 站 服务 器 


要 完成 本 机 站 点 的 创建 ， 并 提供 对 Web 应 用 程序 技术 的 文 持 ， 不 仅 要 有 Web 服务 右 环 
境 ， 而 且 要 有 应 用 程序 服务 器 环境 ， 前 者 提供 对 Web 浏览 的 文 持 ， 而 后 者 提供 对 ASP 等 应 
用 程 序 的 支持 。 IIS 将 Web 服务 器 和 应 用 程序 服务 器 的 功能 合 二 为 一 ， 所 以 不 用 再 安装 其 他 
的 应 用 程序 服务 噩 系统 ， 直 接 利用 IS， 束 可 以 实现 本 机 站 点 的 创建 。 

国 打开 IIS 

首先 启动 HS。 在 不 同 的 操作 系统 下 ， 局 动 IIS 的 方法 也 不 同 ， 下 面 是 在 Windows XP 
Professional 系统 中 启动 IIS 的 方 法 : 

选择 “开始 ”有 末 单 中 的 “设置 ”一 “控制 面板 ”命令 ， 打 开 “ 控 制 面板 ” 
窗口 。 

在 “控制 面板 ”中 双击 “管理 工具 ”图 标 师 ， 打 开 “ 管 理工 具 ” 对 话 框 ， 如 
图 1-8 所 示 。 











| 文件 中 ”编辑 EE) 查看 0 收藏 让 工具 で) 帮助 
Ou © 落 の 昧 区 We 国 . 
; 地 世 Q) | 管理 工具 マ | 回 特色 : 上 同 且 手 回 ・ の 約 折 信吉 


es < 
映 控 方 式 








本 地 安全 策略 
快 捷 方 式 


计算 机 管理 
げ 控制 面板 方式 


晤 我 的 文档 

回 共享 文档 

3 我 的 电脑 斌 引 数据 源 (ODEC) 
ァ ピ 


加 RE 方式 
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管理 工具 
系统 立 件 来 





1-8 “管理 工具 ”对 话 框 











第 1 草 









动态 网 站 开发 基础 





在 “管理 工具 ”对 话 框 中 双击 “Internet 信息 服务 ”图 标 靶 ， 将 启动 IIS, 





如 图 1-9 所 示 。 


\ Intermet 信息 服务 


文件 ) ”操作 必 ) 査 者 ) ”帮助 00) 


Se 画 | 岛 旦 
本: Tnternet 信息 服务 


中- 筷 地 -01 (林地 计算 机 ) 


1-9 


国 设置 默认 的 网 站 站 点 


* 画 I 


回 回 上 











“Tnternet 信息 服务 ”对 话 框 


默认 站 点 就 是 在 浏览 器 的 地 址 栏 中 输入 http://localhost 或 htp://127.0.0.1 所 显示 的 站 点 。 


该 站 点 中 的 所 有 文件 实际 上 位 于 CNImnetpub\wwwroot 文件 夹 中 ， 其 默认 主 


名 称 是 Default.asp。 








页 对 应 页 面 文件 的 





在 HS 窗口 中 ， 用 鼠标 右键 单 击 “本 地 计算 机 ”一 “网 站 ”一 “ 鸭 认 网 站 ”命令 ， 再 右 
键 单 击 “ 上 默认 网 站 ”将 打开 如 图 1-10 所 示 的 快捷 荣 单 ， 用 户 可 进行 相应 操作 。 


な きま Tnternet 信息 服务 


文件 ) 操作 ぬ ) 査 者 ) 帮助 出) 


ゃ うっ 回 国 | 軟 団 還 





SS Pn 











4: Internet 信息 服务 
日 - 筷 士 -01 (未 地 计算 机 ) 
コ 网 站 
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更 IIsHelp 


Printers 





は | 8 PY 打开 必 (0) 
四 -sz 默认 ST 列 筑 5 


pe 1 二 县 资源 管理 器 E) 





日 动 人 
停止 ) 


暂停 &&) 





新建 0) 
所 有 任务 g) 


ト 
ト 





查看 ⑰ 


ト 





重 命名 如 ) 
刷新 ) 


导出 列表 (L)... 


| 性 © | 


帮助 出) 











状态 


cwindowshelpiishelp 
C: WWINDOWS webiprinters 


1-10 站 点 的 右键 快捷 荣 单 
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该 快捷 菜单 中 第 用 命令 的 意义 和 功能 如 下 : 
@ “资源 管理 器 ”， 可 以 月 动 Windows 资 源 管 理 器 ， 并 打开 CNmetputvwwwroot 文 件 夹 。 
@ “打开 ” 可 以 直接 打开 CNmetputwwwroot 文 件 夹 窗口 。 
@ “浏览 ?: 可 以 局 动 浏览 器 ， 并 打开 该 默认 站 点 。 男 外 ， 在 站 点 的 右键 快捷 订单 中 也 
可 以 控制 站 点 的 激活 或 禁止 状态 。 
@ “月 动 ” 可 以 激活 站 上 点， 以便 外 界 访问 。 
“停止 ” 停止 站 点 服务 ， 这 时 站 点 驶 同 外 界 完 全 断 开 ， 外 界 无 法 访问 。 
@ “ 匠 停 ”: 暂时 俘 止 站 点 服务 ， 可 以 重新 选择 该 命令 ， 以 重新 局 动 站 点 。 另 外 ， 在 站 
点 的 右键 快捷 来 单 中 也 可 以 对 站 点 进行 其 他 类 型 的 管理 。 
@ “新建 ” 下 一 级 亲 单 中 只 有 “创建 虚拟 目录 ”这 一 个 选项 ， 通 过 这 个 命令 可 以 建 并 
单独 的 虚拟 站 点 。 
@ “上 所 有 任务 ” 下 一 级 菜单 中 只 有 “权限 癌 寻 ”命令 ， 执 行 后 将 运行 “权限 癌 寻 ”对 
话 框 ， 在 这 里 可 以 设置 安全 属性 等 种 规 功 能 。 
@ “从 看 ”: 和 Windows 的 操作 答 看 功能 一 样 ， 用 来 显示 “名 称 ” 人 “路 径 ” 的 图 标 大 
小 ， 并 可 以 目 定 义 命 令 。 
@ “ 車 命名 ": 乍 狐 命名 站 点 的 名 称 。 
@ “刷新 ”: 可 以 对 站 点 进行 刷 独 ， 以 反映 最 近 对 站 点 进行 的 改动 。 
@ “导出 列表 ”: 执行 该 命令 后 将 日 动 生 成 一 个 .txt 文 档 ， 列 出 IIS 建 立 站 点 的 设置 情 
部。 
@ “属性 ”， 可 以 打开 “属性 ”对 话 框 ， 以 设置 站 点 属性 。 
@ “帮助 *” 可 以 打开 “帮助 ”对 话 杠 ， 里 面 有 关于 IS 设 置 的 相关 内 容 。 
加 创建 新 网 站 站 点 
要 利用 Dreamweaver CS5 进行 Web 应 用 程序 的 开发 ， 首 先 要 为 开发 的 Web 应 用 程序 建 
六 一 个 新 的 网 站 站 点 。 一 般 来 说 ， 可 以 采用 三 种 方法 建立 网 站 站 点 : 真实 目录 、 虚 拟 目 孙 和 
真实 站 点 。 最 党 用 有 的 方法 就 是 采用 虚拟 目录 创建 网 站 站 点 。 
使 用 虚拟 目录 创建 网 站 站 点 的 步骤 如 下 : 
启动 IS， 用 鼠标 右键 单 击 “ 默 认 网 站 ”选项 ， 打 开 如 图 1-10 所 示 的 快捷 
来 单 。 
从 快捷 末 单 中， 选择 “ 狐 建 ”一 “虚拟 目录 ”命令 ， 这 时 将 打开 如 图 1-11 所 
未 的 “虚拟 目录 创建 问 导 ”对 话 框 。 
单 击 “下 一 步 ” 按 钮 ， 在 “虚拟 目录 别名 ”对 话 框 中 的 “别名 ”文本 框 中 输入 
站 点 名 称 ， 假 说 这 里 输入 “website”， 如 图 1-12 所 示 。 
单 击 “ 下 一 步 ” 按 钮 ， 将 打开 如 图 1-13 所 示 的 “网 站 内 容 目 录 ” 对 话 框 ， 提 
示 用 户 输入 虚拟 目录 的 丰 实 位 置 ， 这 里 输入 的 路 任 为 D:\Flash, Flash 文件 夹 里 放置 的 束 是 网 
站 的 所 有 动画 文件 。 
单 击 “ 下 一 步 ” 按 钮 ， 将 打开 如 图 1-14 所 示 的 “访问 权限 ”对 话 框 ， 提 示 用 
户 为 当前 目录 设置 访问 权限 。 该 对 话 框 中 各 个 选项 的 意义 如 下 。 
@ “ 访 取 ” 选择 该 项 ， 则 人 允许 客户 谈 取 虚拟 目录 中 的 内 容 。 通 第 必须 选中 该 项 ， 人 否则 
用 户 无 法 访问 站 点 。 







































































第 1 章 名 省 村 及 加 区 :二 过 fr 


虚拟 目录 创建 网 号 


欢迎 使 用 虚拟 目录 创建 问 寻 


此 向 导 将 帮助 您 在 网 站 上 新 建 一 个 虚拟 目录 。 


单 击 “ 下 一 步 ” 按 钮 继续 。 








图 1-11 “虚拟 目录 创建 癌 导 ”对 话 框 


诬 拟 目录 创建 癌 守 


虚拟 目录 型 名 
必 颍 涯 虚 扒 目录 提供 一 个 简短 的 名 称 或 列 名 ， 以 便于 快速 5 上 用 。 


输 六 用 于 芍 得 Wab 诺 失 目录 硕 问 坎 限 的 列 名 。 使 用 的 命名 规 
则 应 与 目录 前 名 规则 相同 。 
列 名 (A): 


ebsi tl 


< 上 お) _ 取消 | 
图 1-12 输入 站 点 名 称 





诬 扫 目录 创建 同 号 


网 站 内 容 目录 
要 发 布 和 到 网 站 上 的 内 容 的 位 置 。 


输 闵 内容 所 在 的 目录 蹄 往 。 
目录 血 1 


i: Flash 叫 覧 下り... | 








图 1-13 输入 虚拟 目录 的 真实 位 置 
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@ “运行 脚本 《如 ASP)”: 选择 该 项 ， 则 允许 在 虚拟 目录 中 放置 包含 脚本 的 动态 网 页 ， 
以 实现 Web 应 用 程序 的 相关 功能 。 因 为 要 开发 基于 ASP 的 Web 应 用 程序 ， 所 以 应 该 
选中 该 项 。 











に あり ヨロ に 


设置 虚拟 目录 的 访问 梭 限 。 
允许 下 列 梭 限 : 


|y 运 运行 脚本 (HO ASF) GG) 
| 执行 好 ISAFI 应 用 程序 或 CGI) (E) 


| 写 入 ⑱) 
| 训 览 四 ) 
单 击 “ 下 一 步 ” 榨 钮 完成 向 导 。 


《 上 一 步 @) 取消 





图 1-14 设置 虚拟 目录 的 访问 权限 


@ “执行 (如 ISAPI 应 用 程序 或 CGI)” 选择 该 项 ， 则 在 该 虚拟 目录 中 执行 二 进 制程 
序 。 一 般 并 不 同 用 户 介绍 如 何 开 发 服务 器 端的 执行 程序 ， 所 以 该 项 可 以 不 选 。 

@ “ 写 入 ”: 选中 该 项 ， 则 允许 用 户 通 过 浏览 费 回 站 点 中 写 入 文件 。 对 于 一 个 安全 站 点 
来 说 ， 该 项 不 应 该 被 选中 ， 以 避免 用 户 从 您 的 站 点 中 读 取 源 文 件 ， 或 是 任意 删除 站 
点 中 的 文件 。 

@ “浏览 ”” 选中 该 项 ， 则 当 用 户 访问 该 虚拟 目录 时 ， 如 果 目 录 中 没有 默认 主页 ， 则 在 
浏览 堪 中 以 目录 的 形式 显示 站 点 中 的 所 有 文件 ， 通 常 ， 如 果 在 站 点 中 不 是 为 了 提供 
下 载 文件 ， 则 不 应 选中 该 项 。 

单 击 “ 下 一 步 ” 按 钮 ， 将 打开 “已 成 功 完成 虚拟 目录 创建 问 导 ”对 话 框 ， 

如 图 1-15 所 示 。 设 置 完 毕 ， 单 击 “ 完 成 ”按钮 即 完成 操作 。 


虚拟 目录 创建 向 导 

















i 目录 创建 向 


单 击 “ 完 成 ”按钮 继续 








图 1-15 “已 成 功 完 成 虚拟 目录 创建 问 导 ”对 话 框 











动态 网 站 开发 基础 


民品 昌 设置 站 点 属性 


在 IS 中 可 以 设置 站 点 或 站 点 目录 的 多 种 属性 。 要 设置 站 点 或 目录 的 属性 ， 可 以 按照 如 (>) 
下 方法 进行 操作 :启动 IS, 然 后 在 IIS 窗口 左边 列表 框 中 选择 要 设置 属性 的 站 点 或 站 点 跌 
的 目录 ， 这 里 选择 “默认 网 站 ”选项 ， 然 后 单 击 鼠 标 右键 ， 选 择 “ 属 性 ”命令 ， 即 可 打开 站 
点 的 “默认 网 站 属性” 对话 框 ， 如 图 1-16 所 示 。 

















时 世 网 站 对 性 
。 ITYT 基 | 自 定 尽 错误 服务 器 扩展 
网 站 | SEI 征 选 器 主 目录 立 档 目录 实 全 性 
网 站 标识 
描述 E): ET TE 
IF 地 址 总 1 | 全部 未 分 配 ) 所 
TCF 端 口 j: 30 | 
连接 
连接 超时 全: | ann 各 
悦 | 保持 TTF 连接 总 ) 































































































区 | 局 用 日 志 记 录 是 ) 


活动 日 志 格 式 (WY): 
|W3C 扩展 日 志 净 件 格 式 MI [属性 ). 




















图 1-16 “默认 网 站 ”属性 ”对 话 框 


国 设置 “网 站 ”站 点 的 标识 和 连接 属性 

在 如 图 1-16 所 示 的 “网 站 ”选项 卡 中 ， 可 以 设置 用 于 标识 网 站 站 点 的 有 关 参 数 。 

@ “网 站 标识 ” 在 “网 站 标识 ”区 域 ， 可 以 重新 修改 站 点 的 “描述 ”名 称 、“ 卫 地址 ” 
和 “TCP 疹 口 ” 

@ “连接 ” 在 “连接 超时 ”文本 框 中 ， 可 以 设置 保持 连接 的 持续 时 间 。 一 旦 用 户 同 服 
务 右 的 连接 时 间 超 出 了 这 里 设置 的 时 间 ， 而 且 没 有 进行 任何 操作 ， 则 服务 器 将 断 开 
与 用 户 的 连接 ， 该 时 间 以 秒 为 单位 。 如 果 选 中 “保持 HTTP 连 接 ” 复 选 枉 ， 则 可 以 激 
活 网 站 站 点 与 HTTP 的 保持 连接 功能 。 

@ “启用 日 志 记 录 ” 如 果 选 中 “保持 HTTP 连 接 ” 复 选 枉 ， 则 可 以 激活 网 站 站 点 的 记录 
功能 ， 以 记录 用 户 活动 的 细节 ， 并 按 所 选 格 陈 创建 日 六。 通过 阅读 日 六 ， 可 以 了 解 
哪些 用 户 访问 了 站 点 ， 还 可 以 知道 用 户 访 问 了 哪些 信息 。 可 以 在 “活动 日 志 格 式 ” 
列表 中 选择 需要 的 格式 。 
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国 设置 主 目录 

在 站 扩 的 “默认 网 站 ”属性 ”对 话 框 中 单 击 “ 主 目录 ”选项 卡 ， 进 入 如 图 1-17 所 示 
的 对 话 框 。 主 目录 属性 设 蜀 相当 重要 ， 在 浏览 帮 里 输入 的 域名 指 问 的 文件 夹 丈 是 指 这 个 
主 目录 。 限 于 访 幅 ， 这 里 不 对 对 话 框 中 的 所 有 选项 进行 介绍 ， 只 介绍 一 些 较 重要 功能 的 


区 次 














默认 网 站 慣性 


HTTF 头 目 定 避 错 旋 
| 网 站 ”| ISAFI 文选 器 | 主 目录 | 广 档 
连接 到 资 禄 时 的 内 容 来 禄 : 
地) 此 计算 机 上 的 目录 疾 ) 
站 郧 一 各 计算 机 上 的 共享 (8) 
〇 ) 重定 向 到 WEL) 








下 地 路 十 站] ID: dssignem | 


品 写 入 
门 目 录 浏 览 蚀 ) 
应 用 程序 设置 


应 用 程序 名 Wi :车 认 应 用 程序 | 副 際 ) 
开始 位 置 ， WU 同時 > ] 
さ 配電 (5) 


执行 可 限 ) | 纯 脚本 
应 用 程序 保护 好 | 中 (共用 ) 





图 1-17 设置 主 目录 属性 








(1)“ 连 接 到 资源 时 的 内 容 来 源 ” 在 该 区 域 ， 可 以 选择 主 目 录 的 位 置 ， 其 中 包含 如 下 三 
个 选项 : 
@ “此 计算 机 上 的 目录 ” 选中 该 项 ， 则 将 站 点 的 主 目 录 设 置 在 本 地 计算 机 上 ， 这 时 可 
以 在 下 方 的 “本 地 路 人 径 ” 文 本 框 中 输入 目录 的 全 路 人 符 ， 如 Di\designem。 
@ “ 刃 一 台 计 算 机 上 的 共 圣 ” 选中 该 项 ， 则 可 以 将 站 点 的 主 目录 设 章 在 局 域 网 上 的 其 
他 计算 机 共享 目录 中 。 
@ “ 重 定 问 到 URL”: 选中 该 项 ， 则 将 访 站 点 指 回 另外 的 URL， 通 第 可 以 用 于 将 多 个 下 
地 址 指 癌 同一 个 站 点 的 情况 。 
(2)“ 本 地 路 径 ” 当选 中 “此 计算 机 上 的 目录 ”或 “ 另 一 台 计 算 机 上 的 共享 ”选项 时 ， 
会 在 对 话 框 上 显示 访问 许可 设置 的 内 容 项 ， 其 中 最 重要 的 是 “本 地 路 径 ” 文 本 框 中 输入 路 
径 ， 只 有 正确 输入 定义 站 点 的 路 径 才 可 以 访问 到 网 站 的 内 容 。 其 实 还 包括 “该 取 ” 和 “与 
入 ”网 个 选项 。 需 要 注意 的 是 ， 一 般 “ 读 取 ” 选 项 是 一 定 要 选中 的 ， 人 否则 无 法 访问 该 主 目录 
下 的 文件 ， 而 “ 写 入 ”功能 最 好 取消 。 
(3)“ 应 用 程序 设置 ” “应 用 程序 设置 ”可 以 控制 Web 应 用 程序 的 一 些 相 应 选项 。 所 谓 
应 用 程序 ， 指 的 是 两 个 被 标记 为 应 用 程序 的 局 动 点 目录 之 间 所 包含 的 全 部 目录 和 了 文件。 如果 
将 站 点 的 主 目录 标记 为 应 用 程序 局 动 点 ， 则 站 点 中 的 每 个 虚拟 目录 和 真实 有 目录 都 将 目 动 加 入 
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到 应 用 程序 中 。 建 议 将 站 点 的 主 目录 设置 为 应 用 程序 。 
(4)“ 执 行 权限 ”: “执行 权限 ”可 以 控制 应 用 程序 运行 的 权限 ， 其 中 包括 如 下 选项 ; 
e “无 ” 选中 该 项 ， 则 在 当前 选中 目录 中 不 允许 任何 程序 或 脚本 运行 。 
e@ “ 纯 脚 本 ”， 选 中 该 项 ， 则 使 映射 到 脚本 引擎 的 应 用 程序 可 以 在 该 目录 下 运行 ， 而 无 @) 
需 拥 有 “执行 ”权限 。 可 以 对 包含 ASP 脚 本 、Internet 数据 库 接 口 (IDC) 脚本 或 其 
他 脚本 的 目录 使 用 “脚本 ”权限 。“ 脚 本 ”权限 比 “ 执 行 >” 权限 安全 ， 因 为 在 这 种 权 
限 下 二 进 制 文件 是 无 法 运行 的 。 
@ “脚本 和 可 执行 文件 ” 选中 该 项 ， 则 允许 任何 应 用 程序 在 该 目录 中 运行 ， 包 括 映射 
到 脚本 引擎 的 应 用 程序 和 Windows NT 二 进 制 文件 (如 .dll 和 .exe 文 件 )。 
加 设置 默认 文档 
可 以 为 选中 的 站 点 或 目录 定义 默认 文档 ， 通 过 URL 地 址 访问 站 点 目录 时 ， 如 果 没 有 
明确 指定 要 打开 文档 的 名 称 ， 将 打开 这 里 设置 的 默认 文档 。 如 果 选 中 的 目录 是 主 目录 ， 
则 默认 文档 就 是 常 说 的 “主页 ”。 在 站 点 的 属性 对 话 框 中 ， 单 击 “ 文 档 ” 选 项 卡 ， 进 入 如 
1-18 所 示 的 对 话 框 ， 即 可 进行 相应 设置 。 







































































HITF 基 目 定 哆 错误 “服务器 扩展 
| 网 站 | ”ISAFI 敵 洗 器 主 目录 式 柏 | ”目录 安全 性 | 





EE 


[局 用 文档 页 脚 血 ) 


柚 | 政 ][ 晴 9 [| 輸 ) 」 





图 1-18 设置 默认 文档 


默认 状态 下 ， 默 认 文 档 的 名 称 是 “Defaulthtm” 和 “了 Defaultasp”， 单 击 “ 添 加 ”按钮 ， 
可 以 添加 新 的 默认 文档 名 称 ， 单 击 “ 删 除 ” 按 钮 ， 可 以 删除 不 需要 的 默认 文档 名 称 。 单 击 文 
档 名 称 左 侧 的 箭头 按钮 因 和 加 ， 可 以 改变 默认 文档 的 优先 级 顺序 。 











设置 服务 器 站 点 
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设置 服务 右 站 点 后 ，Dreamweaver CS5 才能 在 页面 中 插入 合适 的 服务 右 脚 本 指令 。 如 琳 
选择 使 用 ASP 技术 ， 则 Dreamweaver CSS 将 插入 VBScript、JavaScript、ASPNET、C# 或 
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ASPNET VB 脚本 ; 如 果 选 择 使 用 JSP 技术 ， 则 Dreamweaver CSS 插入 Java 代码 。 定 义 站 点 
以 及 议 置 站 点 的 方法 有 了 两 种 ， 一 种 是 通过 定义 站 点 同 导 来 定义 站 点 ， 另 一 种 方法 是 直接 定义 
站 上 点。 下面 承 定义 站 点 回 寻 的 方法 进行 介绍 。 

用 定义 站 点 问 导 定义 站 点 的 操作 步骤 如 下 : 

在 本 地 计算 机 D 盘 建 立 shop 站 点 文件 夹 ， 在 文件 夹 内 建立 images 子 文件 来 。 
启动 Dreamweaver CS$, 打電 Dreamweaver CSS 的 操作 界面 如 图 1-19 所 示 。 








D 文件 @) 编辑 (EF) 查看 (WV) 插入 (I) 修 改 (W) 格式 (0) 命令 (C) 站 点 (3) 宮口 W) ”和 玫 助 O00) | | 设计 器 v 


bp 


| Adobe BrowserLab | BrowserLab 


打开 最 近 的 项 目 主要 功能 


司 shoplindexasp の | ie CSS 检查 模式 
の | reglshowpassword.asp | Css 和 用 門 用 
| reglshowduestion.asp の | 9 
| regllostpassword.asp P| 点 SP VBScript 区 四 动态 相关 文件 
| reghwelcorme.asp の | XSLT( 整 页 ) 

实时 视图 导航 
の | regluserdelete.asp の | | 
| regiuserdeleteok.asp | BrowserLah 集成 
P| regiuserupdateok.as の | 
ジー 加 更 多 . 
PD reglRegster.asp 

打下 二 





快速 六 站 AdebeG Creatiye Suite® 5 Web 
新 増 + 能 》 Fremius 
资源 》 通过 购买 Adobe Creative Suite 5 Web 


Fremium 获取 Adobe Dreamweaver CS5 
Drearmweaver Exchange » Frofessionals 








田间。 我 的 电脑 
田 - 网 上 邻居 
四 -句点 面 项 目 








1-19 Dreamweaver CSS 的 操作 界面 


执行 菜单 栏 上 的 “站 点 ”一 “管理 站 
点 ”命令 打开“ 管理 站 点 ”对 话 框 ， 如 图 1-20 
所 示 。 














在 该 对 话 框 的 左边 是 站 点 列表 框 ， 显 编辑 E)... 
示 了 所 有 已 经 定义 的 站 点 。 单 击 右边 的 “新 建 ” 按 复制 
钮 ， 则 打开 “站 点 设置 对 象 未 命名 打点 1” 对 话 册 除 包 ) 
框 ， 如 图 1-21 所 示 。 导出 (8)... 

在 “站 点 名 称 ” 文 本 框 中 输入 将 要 建 


立 的 站 点 名 称 。 这 里 输入 “shop” 作 为 站 点 的 名 
称 。 在 “本 地 站 点 文件 夹 ” 文 本 框 中 输入 为 
Di\shop\， 输 入 这 个 地 址 表示 是 本 地 计算 机 的 站 点 1-20 打开 的 “管理 站 点 ”对 话 杠 
的 地 址 ， 输 入 后 如 图 1-22 所 示 。 














ma 品 中 計上 未 命名 站点 1 


Dreamweaver 站 点 是 效 站 中 使 用 的 所 有 训 件 和 次 源 的 集合 。 Dreamweawer 
站 点 通 单 包 舍 两 个 部 分 ; 可 在 其 中 存 俏 和 涉 理 妆 件 的 计算 机 上 的 本 地 区 件 
来 ，| 训 下 可 在 其 中 将 相同 训 件 吉 市 天 web 上 的 服 箸 准 上 的 近 程 京 性 来 。 


您 可 以 在 此 让 当 Dreamweawer 站 点 选择 未 地 立 件 夹 和 名称 。 
站 点 名 称 ! | 未 前 名 站 点 1 
本 地 站 点 况 尾 来 ;| cDCocuments and SettingsadministratorMy Parumentsi 示 | 国 





图 1-21 打开 “站 点 设 置 对 象 ”对 话 框 


靖 点 设置 对 兽 shop 
Dreamweawer 站 点 是 障 站 中 人 重用 的 所 有 交 件 和 资源 的 集 言 。 Dreamweaver 


話 点 通常 包 舎 肉 條 部 分 : 可 在 其 中 存 情 和 处 理 朗 件 的 计算 机 上 的 本 地 区 件 
卖 ， 以 划 可 在 其 中 将 相同 区 件 支 布 到 web 上 的 服务 骼 上 的 远程 区 件 来 。 


您 可 以 在 此 处 漠 Dreamweawer 引 点 逃 振 率 地表 性 送 和 独 痢 。 
站 点 名 称 ; 
本 地 让 点 误 件 来; 円 





图 1-22 输入 站 扣 名 称 和 地 址 


输入 站 点 名 称 和 地 址 后 ， 单 击 “ 服 务 器 ” 列 选项 ， 进 行 站 点 的 服务 器 设置 ， 如 
1-23 上 所 示 。 通 过 该 对 话 框 ， 用 户 可 以 选择 一 种 服务 器 技术 。 通 过 选择 服务 器 技术 可 以 实 
现 动态 网 站 的 建设 ， 在 Dreamweaver CSS 中 包含 的 服务 器 技术 有 ASP JavaScript、ASP 
VBScrip、ASPNET、JSP 及 PHP MySQL 等 解决 方案 。 





站 点 设置 对 守 shop 


ーーーー 净 将 在 此 位 置 选择 学 载 wweb 上 的 页 面 的 服务 器 。 此 对 话 框 的 访 置 来 自 
Internet 服务 提供 两 iP 或 Web 管理 员 。 


些 盛 : 要 玉英 他 只 eammeaker 时 点 上 工藤 ， 殴 五 所 训 已 上 基 需 - 贡 员 亚 和 莹 证 到 en 并 雹 
调 砚 夯 ， 痪 只 所 交 出 一 信 旺 本 肾 达 部 夺 可 - 


| 连接 | 征程 “| 讽 也 | 





图 1-23 “站 点 设置 对 象 shop” 对 话 框 


单 击 对 话 框 上 的 “添加 新 服务 器 ”按钮 三 |， 打 开 “ 基 本 ”选项 卡 ， 在 里 而 对 
服务 器 进行 设置 ,“ 服 务 嚣 名称 ”文本 框 输入 名 称 为 shop,“ 连 接 方法 ”从 下 拉 列 表 项 中 选择 
“本 地 /网 络 ”， “服务器 文件 夹 ” 的 路 任 设 置 为 : D:whop\ Web URL 网 站 地 址 ) 设置 为 : 
http://127.0.0.1/， 设 置 完成 后 ， 如 图 1-24 所 示 。 





半点 设置 对 家 shop 
| | 設置 
服务 器 名 种 
连接 方法 机 ep 发 
服务 器 文 和 天 [ep ”| 启 
web URL EE 












































图 1-24 设置 服务 器 属性 
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单 击 “高 级 ”选项 卡 ， 打 开 服 务 亏 扩 术 设 症 和 面板， 这 里 单 击 选择 “服务 需 模 


型 ”下 拉 三 角 按钮 ， 在 弹出 的 菜单 中 选择 ASP VBScript 选项 ， 表 示 使 用 这 种 技术 开发 网 
站 ， 有 具体 的 设置 如 图 1-2 所 示 。 


清点 调 置 对 守 shop | © 


| 基本 Las 9 
远程 服务器 一 ー 
加 维护 同步 信息 
口 保存 时 自动 将 交 件 上 传 到 服务 器 
口 启用 交 件 取出 功能 
回 打 开 立 件 之 前 职 出 程 “| 测 二 | 
职 出 名 称 : | ] | 








Wh 六 这 























电子 邮件 地 址 ; | 


F 训话 服务 器 
服 范 器 幅 型 ;| 』5P MEScript 





















































图 1-25 设置 服务 器 技术 





设置 好 服务 器 技术 后 ， 单 击 “ 保 存 ” 按 钮 ， 则 会 打开 一 个 选择 存储 文件 位 置 的 
对 话 框 ， 如 图 1-26 所 示 。 


清点 度 置 对 宠 shop 














您 将 在 此 位 置 选 择 革 载 上 mg 上 的 页 面 的 服务 器 。 此 对 话 框 的 设置 来 自 
Internet 服务 提供 商 Pi 或 web 管理 局 。 








导语 : 要 弄 录 芒 DreamWeayer 半点 上 工件， 苍 二 证 定夺 并 上 必 省 胃 杰 萤 胡 邢 Wan 痊 膏 
凋 抽 顾 ， 莉 只 斋 让 一 个 虹 要 虹 窜 训 绩 可. 


| 连接 | 远程 “| 测 坛 | 
本 地 /网络 加 名 





图 1-26 ”选择 存储 文件 的 位 置 
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说 明 : 
远程 和 测试 复 选 框 : 如 果 用 户 选择 了 该 项 ， 并 且 在 计算 机 上 安装 了 IIS， 则 可 以 在 本 地 
计算 机 上 编辑 和 测试 文件 。 


最 后 单 击 “保存 ”按钮 ， 即 可 以 完成 站 点 的 设置 。 到 这 里 融 完 成 了 本 地 站 点 服务 堪 的 规 
划 设 计 ， 通 过 这 一 个 关键 的 设置 可 以 方便 后 面 的 革 市 进行 设计 并 应 用 。 


是 与 ASP 有 关 的 数据 库 连 接 








目前 支持 ASP 的 数据 库 主 要 有 Microsoft Access 和 Microsoft SQL Server。 Microsoft 
Access 是 一 种 Windows 环境 下 的 关系 型 数据 库 系 统 ， 与 其 他 数据 库 相 比 ，Microsoft 
Access 所 提供 的 各 种 工具 既 人 简单 又 方便 ， 因 此 本 书 所 讲述 的 数据 库 主 要 以 Microsoft 
Access 为 主 。Microsoft SQL Server 是 一 种 客户 端 /服务 器 模式 的 关系 型 数据 库 管 理 系统 ， 





使用 Transact-SQL 语句 在 服务 器 和 客户 疾 之 间 传 送 资 料 请 求 ， 本 书 对 Microsoft SQL 
Server 只 做 人 条 单 介 绍 。 





利用 数据 库 连 接 ， 可 以 将 一 个 现 有 的 数据 库 同 当前 的 Web 环境 结合 起 来 ， 通 过 简单 、 
统一 的 编程 接口 和 脚本 代码 ， 实 现 对 数据 库 的 控制 。 要 利用 ASP 访问 数据 库 中 的 数据 ， 肯 
和 完 应 该 构建 系统 环境 同 数据 库 的 连接 。 

使 用 ASP 网 页 访问 网 络 数 据 库 的 执行 过 程 ， 如 图 1-27 所 示 。 





ASP 指 令 
VBScript 
HTML 


客户 端 电脑 








图 1-27 使用 ASP 网 页 访问 网 络 数据 库 的 执行 过 程 


在 图 1-27 中 ， 客 户 疹 安 逆 了 浏览 堪 ， 网 站 服务 器 端 安 厂 了 网 站 服务 器 和 SQL Server 数 
据 库 服 务 左 。 使 用 ASP 操作 数据 库 的 执行 过 程 如 下 : 
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用 户 在 客户 疹 用 浏览 郁 问 网 站 服务 噩 发 送 HTTP 协议 的 请 求 。 

如 果 请 求 要 读 取 的 是 HTML 文件 ， 则 网 站 服务 器 直接 将 这 个 HTML 文件 
返回 。 

如 果 请 求 要 读 取 的 是 ASP 文件 ， 则 网 站 服务 器 就 要 执行 ASP 文件 。 在 ASP 文 
件 中 ， 如 果 有 访问 数据 库 的 操作 ， 则 通过 ADO， 而 ADO 再 通过 ODBC 访问 数据 库 。 网 站 








服务 右 将 访问 结果 生成 HTML 文件 ， 并 将 生成 的 HTML 文件 返回 。 
在 客户 端的 浏览 器 中 ， 解 释 执行 返回 的 HTML 文件 ， 最 终 显示 服务 器 响应 结 
果 的 页 面 。 
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无 论 连 接 什么 样 的 数据 库 ， 首 先 都 要 创建 数据 库 到 ODBC 0 车 接 ， 因 为 在 创建 数据 库 
之 前 ， 必 须 提 供 一 条 可 以 使 ADO 定位 、 标 识 与 数据 库 通 信 有 的 途径 。 在 Windows 系统 中 ， 
ODBC 的 连接 主要 通过 ODBC 数据 源 管理 器 完成 。 

对 于 Windows XP Professional 操作 系统 的 用 户 来 说 ， 建 立 ODBC 数据 源 管 理 器 的 操作 
步骤 如 下 : 

选择 “开始 ”一 “设置 ”一 “控制 面板 ”命令 ， 打 开 “ 控 制 面板 ”对 话 框 ， 如 
图 1-28 所 示 。 





: 文件 ) 编辑 应 ) 查看 收藏 多 工具 て ) 帮助 加 
OO © 落球 世 xW | 国 : 
:地 址 四 区 控 制 面板 。 そそ 司 一 一 マ | 贺 转 到 : 上 网 助手 ”分 与 暂 停 拦 截 


ks b> 
NN 控制 面板 » ペー 
Hero Symantec 打印 村 和 人 苇 1 天 | 
は 切换 到 分 类 视图 项 Imagelrive Livellpdate 真 


电源 选项 0 管理 工具 键盘 区 任 劳 填 划 
る Windows Update 
@) 帮助 和 支持 


“ * 
ーー 


任务 栏 和 [ 日 期 和 时 间 担 描 伺 和 照 添加 或 册 除 
开始 」 荣 单 相机 程序 


受 


添加 硬件 。 ”网 络 连 接 。 净 件 夹 选 项 


② » Eg 


邮件 游戏 控制 器 语音 





1-28 “控制 面板 ”对 话 框 


在 该 对 话 框 中 双击 “管理 工具 ”图 标 忠 ， 将 打开 “管理 工具 ”对 话 框 ， 如 
图 1-29 所 示 。 
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辐 回 加 
: 文件 @) 编辑 侍 ) 查看 QW 收藏 入 工具 ) ”帮助 和 
sm・@6- 共 | の 時 用 間 ※| 国 - 
: 地 址 0) | 上 号 管理 工具 站 因 轩 有 :上 网 助手 ・ 本 暂停 拦截 








Server Extensions 
管 


快捷 方式 


其 它 仔 置 全 


は 控制 面板 计算 机 管理 


加 我 的 文档 快捷 方式 


站 共享 文档 

ーー の ー 数 指 源 (mnEC) 
量 我 的 电脑 了 快捷 方式 

WJ 网 上 邻居 2 KE 


き 
ーー UI 
て 


详细 信息 


管理 工具 
系统 立 件 来 


图 1-29 “管理 工具 ”对 话 框 


双击 “数据 源 (ODBC)” 图 标 训 ， 即 可 打开 “ODBC 数据 源 管理 器 ”对 话 
框 。 一 个 典型 的 ODBC 数据 源 管理 器 如 图 1-30 所 示 。 


10DBC 数据 淹 管 理 各 
用 户 DSH | 系统 DSW | 文件 SW | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 


用 户 数 据 福 0 : 


名 称 | _ 療 加 個 ).… | 


dEASE Files Nicrosoft dBase Driver [dbE] 
DEwebshop Driver do Microsoft hecess mdb) 册 降 (R] | 
Fxcel Files Microsott Excel Driver [ 冰 .x1Ls] 


MS hccess Database Microsoft hecess Driver tw.mdb) 配置 (CI | 





1-30 “ODBC 数据 源 管理 器 ”对 话 框 


“ODBC 数据 源 管 理 器 ”对 话 框 中 包含 了 多 个 选项 卡 ， 可 以 进行 各 种 有 关 
ODBC 的 操作 。 在 默认 状态 下 ,“ODBC 数据 产 定 理 占 ”对 话 框 已 经 内 置 了 多 种 数据 库 
的 驱动 程序 ， 单 击 “ 驱动 程序 ”选项 卡 ， 束 可 以 但 看 当前 要 连接 的 数据 库 类 型 是 否 位 于 
其 中 ， 其 中 “Driver do Microsoft Access(*.mdb)” 选 项 即 是 使 用 Access 数据 库 的 驱动 程 
序 ， 如 图 1-31 所 示 。 
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10DBC 数据 源 管 理 器 
用 户 nsm | 系统 DSW | 立件 nSm 驱动 程序 | 跟踪 “| 连接 池 | 关于 | 
系统 所 安装 的 nnEr 上 蝶 动 程序 中 ): 


Driver do Microsoft Excel tk. ls 
Driver do Microsoft Faradox [*.db ) 
Driver para ロ Microsott Visual FoxFro 
Nicrosoft fccess Driver tt.mdtb) 
Nicrosoft hecess-Treiber 种 .mdb] 
Nicrosoft dBase Driver I*. dbf) 
Nicrosoft dBase YFP Driver [*. dbF] 
Nicrosoft dBase-Treiber (+. dbf) 


党 に 


DEC 驱动 程序 多 许 志 持 nmEC 的 程序 从 nnEr 沙 据 产 藻 职 傅 息 。 
"a 要 安装 新 的 最 动 程序 ， 圭 使 用 其 安装 程序 。 











图 1-31 选择 数据 源 的 驱动 程序 


注意 : 

DSN ( Data Source Name， 数 据 源 名 称 )， 表 示 用 于 将 应 用 程序 和 某 个 数据 库 相 连接 
的 信息 集合 。ODBC 数据 源 管 理 器 使 用 该 信息 创建 指向 数据 库 的 连接 。 通 常 DSN 可 以 
保存 在 文件 或 注册 表 中 。 一 旦 创建 了 一 个 指向 数据 库 的 ODBC 连接 ， 同 该 数据 库 连 接 
的 有 关 信 息 就 被 保存 在 DSN 中 ， 而 在 程序 中 如 果 要 对 数据 库 进行 操作 ， 也 必须 通过 
DSN 进行 。 


通过 图 1-32 可 以 看 到 有 三 种 数据 源 名 称 ， 分 别 是 “用 户 DSN”、“ 系 统 
DSN” 和 “文件 DSN”， 这 表明 通过 “ODBC 数据 源 管 理 器 ”对 话 框 ， 可 以 创建 这 三 种 类型 
的 DSN。 下 面 将 分 别 介绍 三 种 类 型 的 DSN 的 不 同 之 处 : 

@ “用 户 DSN”: 用 户 DSN 是 锌 用户 下 接 使 用 的 DSN， 而 ASP 古 不 能 使 用 它 的 ， 因 此 对 

于 本 书 来 说 ， 不 需要 构建 这 种 用 户 DSN。 用 户 DSN 通 常 保存 在 注册 表 中 ， 可 以 使 用 
regedt32 或 regedit 命 令 访问 。 

@ “系统 DSN”: 系统 DSN 是 由 系统 进程 (如 IS〉 所 使 用 的 DSN， 系 统 DSN 信 息 同样 被 

存储 在 注册 表 中 。 

@ “文件 DSN”: 文件 DSN 同 系统 DSN 的 区 别 是 它 你 存在 文件 中 ， 而 不 是 注册 表 中 。 默 

认 状 态 下 ， 文 件 DSN 保 存在 C:\Program Files\Common Files\ODBC\Data Sources 文 件 夹 
中 。 

文件 DSN 的 优点 在 于 便于 移动 ， 因 为 DSN 信息 保存 在 独立 的 文件 中 ， 如 果 用 户 希 望 将 
整个 Web 应 用 程序 和 数据 库 移动 到 其 他 计算 机 中 ， 只 需 连 同 生 成 的 DSN 文件 一 起 移动 即 
可 。 而 系统 DSN 因为 信息 是 保存 在 注册 表 中 的 ， 所 以 移动 起 来 焉 不 那么 方便 了 。 但 是 ， 如 
果 要 经 和 党 修改 数据 库 ， 文 件 DSN 丈 显 得 不 如 系统 DSN 方便 。 使 用 系统 DSN 时 ， 如 和 果 要 改 
变 所 使 用 的 数据 库 ， 只 需 人 简单 地 修改 Windows 的 注册 表 。 而 使 用 文件 DSN， 则 必须 每 次 都 
修改 Globalasa 文件 。 另 外 ， 如 末 需 要 在 计算 机 上 的 许多 不 同 应 用 程序 中 使 用 同一 个 DSN, 
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那么 显然 使 用 系统 DSN 更 加 方便 。 

由 于 本 书 使 用 系统 进程 IS 作为 服务 器 的 平台 ， 所 以 通常 将 ODBC 创建 为 “ 系 
统 DSN”。 创建 系统 DSN， 首 先 要 启动 ODBC 数据 源 管理 器 ， 然 后 选择 “系统 DSN” 选 项 
卡 ， 如 图 1-32 所 示 。 


10ODBC 束 据 谣 管 理 需 
用 户 DsW 系统 DSHW | 立件 DsW | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系 纺 数据 彰 总 ) : 


dsnmessaee Driver do Microsoft hccess tt.mdb) 
Microsoft hecess Driver [*.mdb) 





图 1-32 “系统 DSN” 选 项 卡 


单 击 “ 添 加 ” 投 钮 ， 将 打开 如 图 1-33 所 示 的 “创建 独 数 据 源 ”对 话 框 ， 提 示 
选择 需要 的 数据 源 驱 动 程序 。 


亨 建 独 数 据 弄 
选择 悠 想 为 其 安装 数据 源 的 豫 动 程序 (8)。 


da Microsoft para argquivos texto [+, 
rwer do Microsoft Aceess [mdb) 

dn Microsoft dEase 上 dh] 

do Microsoft Exeel [rl 

do Microsoft Faradox [*. db 1 


Driver para o Microsott Visual FoxFro 


Nicrosoft 点 eeess Driver 名 .mdb) 
Nicrosoft hecess-Treiber mdb 
Microsoft dBase Driver tk. dbf) 
Microsoft dEase VFF Driver tt. db£) 
そ | 











图 1-33 ”选择 数据 源 驱 动 程序 


由 于 本 书 中 使 用 的 数据 库 是 Access， 所 以 需要 创建 指 癌 Access 数据 库 的 连 
接 ， 因 此 应 该 在 驱动 程序 列表 中 选择 “Driver do Microsoft Access 〈*.mdb)” 选 项 。 
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单 击 “ 完 成 ”按钮 ， 将 打开 如 网 1-34 所 示 的 “ODBC Microsoft Access 安 装 ” 
对 话 框 ， 提 示 输 入 数据 源 名 称 ， 并 选择 要 连接 的 数据 库 文件 。 


ODBC 下 icrosoft Access 安装 


沼 据 淹 : 考 必 ) testDatabase © 
品 明 (| ItastHatabasl ] 
数据 库 


数据 库 : 帮助 HM) | 
选择 [8)... | 创建 C0)... | 昼 握 下り. | 压缩 册 )... | = | 


系统 数据 库 


取消 


* 无 还) 
”数据 库 上 : 


[ES | 选项 (0) >> | 








图 1-34 ”设置 数据 源 名 称 及 连接 





在 “数据 源 名 ”文本 框 中 输入 需要 的 数据 源 名 称 ， 这 里 输入 “testDatabase ”， 
在 “描述 ”文本 框 中 输入 希望 的 描述 信息 ， 如 “testDatabase ”。 

单 击 “ 选 择 ” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 框 ， 可 以 选择 适合 的 Access 文 
件 ， 如 图 1-35 所 示 。 





数据 库 名 0 目 服 : 
[shop. mdb d: shop'mdb 








并 件 关 型 IT); ョ Ba 【『」・ 


[hecess 郑 据 库 (ば mr | = 。 











图 1-35 “选择 数据 库 ” 对 话 框 


单 击 “确定 ”按钮 确认 操作 后 ， 返 回 如 图 1-34 所 示 的 对 话 框 中 。 

在 “ODBC Microsoft Access 安装 ”对 话 框 中 还 有 其 他 一 些 选项 ， 这 些 选 项 
在 此 不 需要 使 用 ， 直 接 单 击 “ 确 定 ” 按 钮 ， 即 可 返回 到 ODBC 数据 源 管理 器 的 “系统 
DSN” 选 项 卡 中 ， 并 且 可 以 看 到 ， 刚 刚 创 建 的 系统 DSN 名 称 显 示 在 “系统 数据 源 ” 列 表 
中 ， 如 图 1-36 所 示 。 

单 击 “确定 ”按钮 ， 确 认 操 作 并 关闭 “ODBC 数据 源 管理 占 ” 对 话 框 。 
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1npBc 款 据 谣 管 理 需 
用 户 nsm 系统 DSH | 文件 DsW | 驱动 程序 | 跟踪 “| 连接 池 | 关于 | 
系统 数据 洒 店 ): 


驱动 程序 


Driwver do Microsoft hecess .mdb) 





图 1-36 ”新 创建 的 系统 DSN 





上 创建 ADO 连 接 


如 果 要 在 Dreamweaver CSS 中 使 用 数据 库 ， 还 必须 创建 数据 库 连 接 。 在 建立 连接 时 必须 





选择 一 种 合适 的 连接 类 型 ， 如 ADO、JDBC 或 Cold Fusion。 选 择 建 立 不 同 的 连接 类 型 ， 其 操 
作 方 法 及 步骤 也 不 一 样 。 如 果 使 用 ASP 技术 ， 则 必须 创建 “运行 时 刻 ADO 数据 库 连 接 ” 

在 Dreamweaver CSS 中 创建 数据 库 连 接 时 ， 可 以 创建 两 种 类 型 的 连接 : 设计 时 刻 连 接 和 
运行 时 刻 连 接 。 

回 设计 时 刻 连接 : 就 是 在 进行 Web 应 用 程序 设计 时 使 用 的 连接 。 

加 运行 时 刻 连接 : 就 是 在 真正 使 用 浏览 器 浏览 站 点 时 所 使 用 的 连接 。 

为 Web 应 用 程序 总 是 要 被 激活 的 ， 换 句 话 说， 站 点 总 是 要 被 浏览 的 ， 所 以 在 
Dreamweaver CSS 中 运行 时 刻 连接 的 操作 是 必 不 可 少 的 。 如 果 用 Dreamweaver CSS 来 开 友 网 
站 建设 ， 设 计时 刻 连接 是 必 不 可 少 的 。 

大 多 数 情 况 下 ， 不 必 明 确 指定 设计 时 刻 连接 ， 而 只 需 将 设计 时 刻 连 接 同 运行 时 刻 连接 设 
置 为 一 人 改 ， 束 可 以 确保 无 论 是 设计 时 还 是 运行 时 ， 都 能 够 正常 访问 到 数据 库 。 

对 于 设计 时 刻 连接 来 说 ， 决 定 连接 方式 的 因 么 就 是 用 户 当 前 的 开 友 环境 ， 这 与 在 站 点 中 
要 使 用 的 技术 无 天 。 使 用 Windows 计算 机 并 使 用 Access 驱动 程序 ， 则 需要 创建 ADO 连 
接 。 而 最 终生 成 的 站 点 中 采用 什么 技术 ， 则 是 在 运行 时 和 ee 
刻 连接 方式 中 所 设置 的 。 RO 



































、 ee 、 若 要 在 该 页 面 上 使 用 动态 数据 : 
回 建立 Dreamweaver CS5 在 运行 时 刻 的 ADO 连接 J 」 団 波 件 人 陸 交点 
ZL i = Wy 挡 闪 型 ロ 

在 Dreamweaver CSS 中 打开 前 面 创 建 的 设置 让 点 的 测 寺 服务 器 


shop 站 点 ， 建 立 一 个 “index.asp” 页 面 ， 选 择 菜 单 栏 上 


的 “窗口 ”一 “数据 库 ” 命 令 ， 打 开 “ 应 用 程序 ”面板 


中 的 “数据 库 ” 选 项 卡 ， 如 图 1-37 所 示 。 
图 1-37 “数据 库 ” 选 项 卡 
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单 击 该 选项 卡 中 的 “+” 号 按钮 机 ， 从 打开 的 下 拉 荣 单 中 选择 “数据 源 名 称 
(DSN)” 命 令 ， 将 打开 “数据 源 名 称 (DSN)” 对 话 框 ， 如 图 1-38 所 示 。 


数 据 澤 名 称 (DsH) 


名 
数据 源 名 称 DSH) i 
用 玉名 | | 
密码 :| | 
Dreamweaver 应 连接 : し ) 使用 測 試 服 党 器 上 的 DSH 
③) 使 用 本 地 DSH 





图 1-38 “数据 源 名 称 “(DSN)” 对话 框 

选中 “使 用 本 地 DSN” 单 选 按 钮 。 

在 “连接 名 称 ” 文 本 框 中 输入 连接 的 名 称 ， 这 里 输入 的 是 “testDatabase”。 

在 “数据 源 名 称 ” 下 拉 列 表 框 中 选择 一 个 数据 源 名 称 ， 选 择 已 经 建立 好 的 
“testDatabase ”数据 源 。 

在 “用 户 名 ”和 “密码 ”后 和 面 的 文本 框 中 分 别 输 入 用 户 名 及 密码 ， 此 两 项 也 可 
以 不用 填 与 。 

现在 需要 检测 连接 是 否 建 并 成 功 ， 单 击 “ 测 试 ” 按 钮 ， 弹 出 如 图 1-39 所 示 的 
对 话 框 ， 表 示 建 立 连接 成 功 。 

单 击 “确定 ”按钮 ， 返 回 到 “数据 产 ” 面 板 ， 可 以 看 到 在 “数据 源 名 称 ” 对 话 
框 中 可 以 看 到 新 建立 的 连接 ， 如 图 1-40 所 示 。 

















数据 库 エロ テー コー ロロ ーー 站 三 
二 一 其 档 类 型 : hsF VEScript | 









tastlatabasa 

回 - 脚本 编制 
回 誤 ”版 权 表 

圏 产品 表 

轩 产品 主 类 别 加 

団 

8 


名 
明 
田 
图 記 品 子 美 到 
田 


Eh hd 





_ 卫 ) 成功 创 哇 连接 脚本 。 


请 起 圏 订单 表 


| 用 -天 订单 产品 v 
图 1-39 测试 连接 成 功 图 1-40 建立 连接 后 的 “数据 库 ” 对 话 框 





外- 由- 由- 由- 由: 


加 建立 Dreamweaver CS5 在 设计 时 刻 的 ADO 连接 

在 Dreamweaver CSS 有 的 “文档 ”窗口 中 ， 选 择 末 单 栏 上 的 “窗口 ”一 “数据 
库 ” 命 令 ， 打 开 “ 数 据 库 ” 和 面板 。 

单 击 该 对 话 框 中 的 “+” 号 按钮 双 ， 从 打开 的 下 拉 采 单 中 选择 “上 自 定义 连接 字 
符 串 ”命令 ， 打 开 “ 目 定义 连接 字符 串 ” 对 话 框 ， 如 几 1-41 所 示 。 

在 “连接 名 称 ” 文 本 框 中 输入 连接 的 名 称 〔 一 般 可 以 输入 “conn+ 数 据 库 名 
称 ” 作 为 连接 的 名 称 )。 这 里 输入 连接 名 称 为 “conn ”。 

在 “连接 字符 串 ” 文 本 框 中 输入 服务 器 上 的 数据 库 的 名 称 ， 如 “testDatabase ”。 
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选中 “使 用 此 计算 机 上 的 驱动 程序 ” 单 选 按 钮 。 

现在 可 以 检测 连接 是 否 建立 成 功 ， 单 击 “ 测 试 ” 按 钮 ， 如 果 弹 出 如 图 1-38 所 
示 的 对 话 框 ， 则 表示 建立 连接 成 功 。 

单 击 “ 确 定 ” 按 钮 确认 操作 并 关闭 “上 自 定义 连接 字符 串 ” 对 话 框 ， 在 “数据 
库 ” 对 话 框 中 可 以 看 到 新 建立 的 连接 ， 如 图 1-42 所 示 。 


圭一 其 档 类 型 :MSF VBScript 










日 中 cor 内 
日 ~- 芭 ”脚本 编制 
国 产品 表 

轩 产品 主 业 别 

图 ”产品 子 类 别 

: 团 ”订单 表 

天 订单 产品 是 


图 1-41 “和 目 定义 连接 字符 串 ” 对 话 框 图 1-42 ”建立 的 新 连接 





自 定义 连接 字符 串 








十 | 








连接 名 称 : lcorm | 
连接 字符 审 : t estDatabase| 











Dr eamweaver 应 连接 : 使 用 测试 服务 器 上 的 驱动 程序 
名 使 用 此 计算 机 上 的 驱动 程序 





而 四 -由 - 贞 一 中: 
Eo 
国 











计生 访问 SQL Server 数 据 库 


ASP 应 用 程序 使 用 ADO (ActiveX Data Object) 对 象 访 问 SQL Server 数据 库 。ASP 网 





页 源 程序 由 三 种 语法 成 分 组 成 :标记 语句 、 脚 本 语句 和 ASP 内 建 对 象 语句 。 

@ “标记 语句 ” 用 来 修饰 页 面 的 外 观 。 标 记 由 HTML (Hypertext Makeup Language, 
超 文 本 标记 语言 ) 编写 。HTML 是 一 种 包含 超 链 接 的 网 页 元 素 的 标记 语言 。 在 ASP 
网 页 中 ， 使 用 HTML 语句 设计 输入 数据 的 界面 在 浏览 右 中 显示 的 式样 和 将 访问 数据 
库 的 结果 返回 浏览 右 。 

@ “脚本 语句 ”脚本 语句 中 包含 变量 、 表 达 式 、 函 数 以 及 流程 控制 语句 等 语法 成 分 。 
HTML 中 没有 这 些 编写 程序 所 应 有 的 语法 成 分 。 在 ASP 网 页 中 ， 使 用 脚本 语句 扩展 
网 页 处 理 数据 的 功能 。 和 常见 的 脚本 语言 有 VBScript、JavaScript 等 语言 ， 本 节 仅 介绍 
VBScript。 VBScript 是 Visual Basic 的 一 个 子 集 ， 在 ASP 网 页 中 ， 可 将 VBScript 插入 
到 HTML 的 脚本 标记 中 。 

@ “ASP 内 建 对 象 的 特殊 性 ” 它们 是 在 ASP 网 页 内 预定 义 的 。 在 脚本 中 ， 使 用 它们 之 
前 无 顷 创 建 。 在 ASP 网 页 中 ， 使 用 ASP 内 建 对 象 的 方法 创建 ADO 対象 。 然 后 , 使 
用 ADO 对 象 访问 SQL Server 数据 库 。 

在 ASP 页 面 中 ， 访 问 SQL Server 数据 库 的 步骤 如 下 : 

使用 ASP 対象 server 的 createobject 方法 ， 创 建 ADO 的 连接 对 象 connection， 


例如 : 


















































set conn=server.createobject("adodb.connection") 





使用 ASP 対象 server 的 createobject 方法 ， 创 建 ADO 的 记录 和 集 对 象 recordset, 
例如 : 


set recs=server.createobject("adodb.recordset") 





第 1 音 名目 村 及 加 下 区 十 过 fr 








使 用 连接 对 象 conn 的 open 方法 ， 连 接 数据 源 ， 例 如 : 
str="driver={SQL Server!;database=lib;server=(local);uid=sa;pwd=sa" 
conn.open str i 
str 赴 達 接 字 符 沖 。 其 中, driver 指定 ODBC 的 驱动 程序 ，database 指定 数 据 麻 , server © 
指定 服务 器 ，uid 指定 用 户 ，pwd 指定 用 户口 令 。 J 
使 用 记录 集 对 象 recs 的 open 方法 ， 获 取 数 据 ， 例 如 : ba 


11 














一 1 


sql="select * from books order by 登录 号 
recs.open sdl,conn,1,1 
sql 是 SQL 语句 字符 串 ， 指 定 对 数据 库 的 访问 。 记 录 集 对 象 的 open 方法 有 4 个 参数 ， 
分 别 为 : 访问 数据 库 的 语句 、 连 接 对 象 、 游 标 类 型 和 锁定 类型 。 
根据 应 用 程序 的 需求 ， 对 结果 集 recs 进行 处 理 。 比 如 ， 使 用 表格 显示 recs 的 
内 容 。 如 果 SQL 语句 中 包含 输入 的 参数 ， 那 么 应 在 编写 SQL 语句 字符 串 之 前 ， 从 ASP 対象 
Request 的 集合 form 和 QueryString 中 ， 获 取 SQL 语句 中 所 需要 的 参数 。 


高 级 SQL 语句 创建 记录 集 


SQL 是 Structured Query Language 【结构 陈 奏 询 语言 ) 的 缩写 ， 是 对 数据 库 中 的 数据 进 
行 组 织 、 管 理 和 检索 的 一 种 工具 。 当 用 户 想 要 检索 数据 库 中 的 数据 时 ， 可 以 通过 SQL 语句 
发 出 请 求 ， 然 后 DBMS 对 该 SQL 请 求 进行 处 理 并 检索 所 要 求 的 数据 ， 最 后 将 其 返回 给 用 
户 ， 这 个 过 程 被 称 之 为 数据 库 人 查询 。 在 Dreamweaver CSS 中 使用 SQL 构建 数据 库 和 但 询 ， 能 
够 上 自动 连接 数据 库 对 象 ， 用 户 不 需要 书写 复 森 SQL 代码 。 但 是 对 于 一 些 复杂 的 查询， 如 使 
用 蜗 级 “记录 集 ” 对 话 框 查询 数据 亩 ， 束 有 必要 了 解 SQL 语句 ， 局 级 “记录 集 ” 对 话 框 如 
1-43 所 示 。 

















に 
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testlatabase wv 
































本 表 格 添加 到 SaL: 
四 内 视图 











3 現存 千 程 ーー 


IRTIER BY 





图 1-43 ”高 级 “记录 集 ” 对 话 框 
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SQL 是 一 种 数据 库 子 语言 ，SQL 语句 可 以 被 租 入 到 男 一 种 语言 中 ， 从 而 使 其 具有 数据 
库存 取 功 能 。SQL 语法 易于 理解 ， 大 多 数 SQL 语句 都 是 直 述 其 意 的 。SQL 也 是 一 种 交互 式 
查询 语言 ， 人 允许 用 户 直 接 查 询 存 储 数据 ， 利 用 这 一 交互 特性 ， 用 户 可 以 在 很 短 的 时 间 内 查询 
相当 复杂 的 问题 。 下 面 就 简要 介绍 一 下 如 何 使 用 简单 的 SQL 查询 语句 。 


i 查询 整个 表 


查询 是 SQL 语言 的 核心 ， 而 用 于 表达 SQL 查询 的 SELECT 语句 的 功能 较 强 ， 同 时 也 是 
较为 复杂 的 SQL 语句 ， 它 从 数据 库 中 检索 数据 ， 并 将 得 询 结 末 提供 给 用 户 。 

当 建 立 数据 库 连 接 后 ， 选 择 来 单 栏 上 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绪 
定 ” 对 话 框 ， 单 击 该 面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 下 拉 菜 单 中 选择 “记录 集 〈 查 询 )” 
命令 ， 则 打开 “记录 集 ” 对 话 框 。 

单 击 该 对 话 框 右 侧 的 “高 级 ”按钮 ， 切 换 到 高 级 “记录 集 ” 对 话 框 ， 该 对 话 框 
显示 如 图 1-44 所 示 。 
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i : |testllatabase 





: ISELECT* 
FEnM 用 户 表 

















添加 到 SQL: 


SELECT 


"HERE 


DRDER BY 





图 1-44 “记录 集 ” 对 话 框 
将 “名 称 和 “连接 ”参数 设置 完成 后 ， 在 SQL 文本 区 域 中 和 直接 输入 但 询 整 个 表 的 语句 : 


SELECT* 
FROM 用 户 表 


这 条 SQL 语句 表示 从 “bookdata” 数 据 表 中 合 询 所 有 了 字段 中 的 数据 ， 也 就 是 所 
有 数据 。 此 时 可 以 测试 该 语句 的 功能 ， 单 击 高 级 “记录 集 ” 对 话 框 中 的 “ 训 试 ” 投 钮 ， 将 打 
开 如 图 1-45 所 示 的 记录 集 。 

蛙 击 “确定” 控 钮 ， 关 闭 该 窗口 ， 返 回 到 噩 级 “记录 集 ” 对 话 框 。 在 该 对 话 框 
中 单 击 “ 人 确定” 按钮 ，Dreamweaver CSS 会 日 动 把 记录 添加 到 “应 用 程序 ”面板 中 的 “ 绑 
定 ” 选 项 卡 的 有 效 数 据 源 列表 中 ， 如 图 1-46 所 示 。 




























@ 





数据 库 | 卷 定 | 服务 器 行为 | < 寺 


+ 一 并 档 类 型 : ASF VESeript [| 





密码 真 .… 性 别 电话 手机 电 .. 人 攻 址 说 明 属性 
admin admin 818... 138... des... 北 .… 管理 员 adni 
T71011 林 小 明 去 688... 138... hai..， 北 .. 我 ... 


用 ... 
admin 


























二 
1-45 测试 状态 的 记录 集 1-46 绑 定 的 记录 集 对 话 框 








打开 高 级 “记录 集 ” 对 话 框 ， 在 该 对 话 框 中 的 SQL 文本 区 域 中 输入 : 
SELECT 用 户 名 
FROM 用 户 表 
这 条 SQL 语句 表示 从 bookdata 数据 表 中 查询 “产品 编码 ”这 个 字段 中 的 数据 。 
此 时 可 以 测试 该 语句 的 功能 。 单 击 高 级 “记录 集 ” 对 话 框 中 的 “测试 ”按钮 ， 将 打开 如 
图 1-47 所 示 的 记录 集 。 


测试 5Q9L 指 令 




















前 25 个 (F) 下 25 个 (8) 





1-47 测试 状态 的 记录 集 
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单 击 “ 人 确定” 按钮， 关闭 该 窗口 并 人 返回 到 融 级 “记录 集 ” 对 话 框 。 在 该 对 话 框 中 单 
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击 “ 人 确定” 按钮 ，Dreamweaver CS5 会 自动 把 记录 添加 到 数据 绑 定 对 话 框 的 有 效 数 据 源 
列表 中 。 


-~ 


查询 符合 一 定 条 件 的 特定 字段 的 


得 询 功 能 中 包括 得 询 符合 一 定 条 件 的 特定 字段 ， 如 条 没有 一 定 的 SQL 语言 基础 ， 要 下 
接 在 高 级 “记录 集 ” 对 话 框 中 编写 命令 是 有 一 定 困 难 的 ， 所 科 的 是 ， 在 Dreamweaver CS5 
中 ， 用 户 可 以 通过 “记录 集 ” 高 级 设置 面板 直接 得 询 符合 一 定 条 件 的 特定 字段 ， 下 面 束 来 介 
绍 一 下 如 何 进行 操作 : 

打开 光 租 中 本 章节 建立 的 index.asp 页 面 ， 单 击 “ 应 用 程序 ”面板 中 的 
“ 绑 定 ”选项 卡 ， 双 击 该 选项 卡 中 的 “记录 集 (conn)” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 
如 图 1-48 所 示 。 

单 击 “ 箭 选 ” 下 拉 列 表 框 右 侧 的 第 一 个 下 拉 三 角 投 钮 关 ， 打 开 下 拉 列 表 ， 选 择 
要 议 置 得 询 的 特定 字段 选项 ， 这 里 选择 “产品 ID ”选项 。 然 后 单 击 右 侧 的 第 二 个 下 拉 三 角 
按钮 w， 在 打开 的 下 拉 列 表 中 选择 设置 查询 的 方式 为 “=”( 完 全 等 于 ) 选项 。 

单 击 “ 辞 选 ”下 拉 列 表 框 第 二 行 的 第 一 个 下 拉 三 角 按 钮 等， 打开 下 拉 列 表 ， 选 
择 “URL 参数 ”选项 ， 在 其 右 侧 的 文本 框 中 输入 “产品 DD” 表示 从 其 他 页 和 面 传递 到 该 页 耐 
的 “产品 卫 ” 等 于 数据 库 中 的 “产品 ID ” 


注意 : 

该 设置 在 制作 各 系统 时 经 常 使 用 ， 如 制作 新 闻 系统 时 ， 单 击 某 一 个 新 闻 标 题 时 能 打 
开 详 细 的 页 面 ， 使 用 的 就 是 这 种 查询 ， 关 于 查询 的 其 他 参数 设置 将 在 本 书后 面 的 章节 中 
进行 介绍 . 







































































on | 
连接 : testDatabase 。 


表格 :| 产 品 表 | 






























































列 : で ) 全 部 馈 选 定 的 : 


































































































图 1-48 打开 的 “记录 集 ” 对 话 框 


单 击 “测试 ”按钮 ， 则 弹出 “请 提供 一 个 测试 值 ” 对 话 框 ， 在 “测试 值 ” 文 本 
框 中 输入 “2” 如 图 1-49 所 示 。 
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| 


请 提供 训话 值 唉 UET 大 数 : 产品 ID 
時 





图 1-49 打开 的 “请 提供 一 个 测试 值 ” 对 话 框 





单 击 “ 确 定 ” 按 钮 ， 就 可 以 碍 找到 第 2 条 数据 相关 的 内 容 ， 如 图 1-50 所 示 。 


测试 5QL 指 邻 





产品 编码 产品 正面 产品 衣 类 列 | 产品 说 明 
JadewenDD2 uploadfile. .. uploadfile... 婚 站 婚 名 好 看 的 很 











图 1-50 ”测试 结果 


单 击 “ 确 定 ”按钮 ， 返 回 “ 记 录 集 ”对 话 框 ， 单 击 “ 高 级 ”按钮 ， 打 开 高 级 
“记录 集 ” 对 话 框 ， 如 图 1-51 所 示 ， 可 以 看 到 系统 自动 加 入 的 SQL 命令 。 








名 称 : 司 計 


连接 : | testDatabase 





SQL: SELECT * 
FROM 产品 表 
WHERE [产品 ID] = MMColFaram 





.加 日 


MMColF ar am : 
类 型 : 1c 
默认 但 : 1 


添加 到 SQL: 


SELECT 


WHERE 


DRDER BY 


狼 ”预存 过 程 





图 1-51 打开 的 高 级 “记录 集 ” 对 话 杠 
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记录 排序 


打开 “记录 集 ” 对 话 框 ， 单 击 “ 排 序 ” 下 拉 列 表 框 右 侧 的 第 一 个 下 拉 三 角 按钮 各， 打 
开 下 拉 列 表 ， 选 择 要 设 章 排 序 的 衬 段 选项 ， 如 这 里 选择 “产品 卫 ” 选 项 。 然 后 单 击 右 侧 的 
第 二 个 下 拉 三 角 按 钮 男 ， 在 打开 的 下 拉 列 表 中 选择 设置 排序 方式 为 “降序 ”， 如 图 1-52 
所 示 。 




















名称 |eom | 
连接 : | testDatabase 。 人 呈 
表格 : | 产品 表 v 

列 : 心 全 部 〇 选 定 的 : 




































































排序 : 产品 IT wt 


























图 1-52 ”设置 排 序 字 段 





这 样 的 设置 可 以 使 查询 的 记录 按 加 入 的 产品 ID 号 降序 排列 。 

通过 以 上 几 个 简单 的 实例 可 以 看 出 ，SQL 的 SELECT 语句 和 英文 语法 很 相像 。SELECT 
语句 的 完整 格式 包括 6 个 语句 ， 其 中 SELECT 和 FROM 语句 是 必须 包含 的 ， 其 他 语句 可 以 
任 选 ， 每 个 语句 的 功能 如 下 : 

国 Select 语句 

Select 语句 列 出 所 有 要 求 SELECT 语句 检索 的 数据 项 。 它 放 在 SELECT 语句 开始 处 ， 指 
定 此 查询 要 检索 的 数据 项 。 这 些 数据 项 通常 用 选择 表 表 示 ， 即 一 组 用 “,” 隔 开 的 选择 项 。 
按照 从 左 到 右 的 顺序 ， 每 个 选择 项 产生 一 个 列 的 查询 结果 ， 一 个 选择 项 可 以 是 以 下 项 目 中 的 
ルイ: 

@ 別名 : 标识 FROM 语句 指定 表 中 的 列 。 如 果 列 名 作为 选择 项 ， 则 SQL 直接 从 数据 库 

表 中 的 每 行 取 出 该 列 的 值 ， 再 将 其 放 在 得 询 结束 的 相应 行 中 。 

@ 常 数 : 指定 在 查询 结果 的 每 行 中 都 放 上 该 值 。 

@ SQL 表达 式 : 说 明 必 须 将 要 放 入 查询 结果 中 的 值 按 表 达 式 的 规定 进行 计算 。 

国 From 语句 

From 语句 列 出 包含 所 要 查询 数据 的 表 ， 它 由 关键 字 FROM 后 跟 一 组 用 喜 号 分 开 的 表 名 
组 成 。 每 个 表 名 都 代表 一 个 包括 该 查询 要 检索 数据 的 表 。 这 些 表 称 为 SQL 语句 的 数据 源 ， 
因为 伍 询 结果 都 源 于 它们 。 
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加 Where 语句 

Where 语句 只 查询 某 些 行 中 满足 一 定 条 件 的 数据 ， 这 些 行 用 搜索 条 件 描述 。 

加 Group By 语句 
Group By 语句 指 定 汇总 查询 ， 即 不 是 对 每 行 产 生 一 个 查询 结果 ， 而 是 将 相似 的 行进 行 (>) 











分 组 ， 再 对 每 组 产生 一 个 汇总 结果 。 

加 Having 语句 

Having 语句 产生 由 Group By 得 到 的 某 些 组 的 结果 ， 和 Where 语句 一 样 ， 所 需要 的 组 也 
用 一 个 搜索 条 件 指定 。 

国 Order By 语句 

Order By 语句 将 但 询 结 来 按 一 列 或 多 列 进行 排 夺 。 如 果 省 略 此 语句 ， 则 查询 结 来 将 是 无 
序 排列 的 。 


Section _ 








创建 ASP 动 态 对 象 











所 有 的 数据 库 操 作 ， 都 是 根据 碍 询 条 件 从 数据 库 中 挑选 出 符合 需要 的 记录 ， 在 “ 绑 定 ” 
面板 中 绑 定 记录 集 ， 通 过 在 页 面 上 增加 或 删除 记录 集 对 象 来 实现 操作 的 。 由 于 显示 在 页 面 上 
的 内 容 是 不 固定 的 ， 是 随 看 数据 库 俘 询 结 来 的 变化 而 变化 的 ， 因 此 ， 在 页 面 上 显示 数据 库 数 
据 的 操作 ， 也 被 称 为 “添加 动态 对 象 ”。 本 节 将 从 整体 上 介绍 添加 动态 对 象 的 步 又 和 方法 以 
及 相关 的 知识 。 


天河 生 创建 动态 对 象 的 步 又 


使用 Dreamweaver CSS 创建 动态 对 象 的 方法 和 步骤 如 下 : 

创建 静态 页 面 。 在 设计 动态 网 页 的 过 程 中 ， 为 了 把 握 页 面 的 总 体外 观 ， 可 以 先 
将 网 页 设计 成 一 个 静态 页 面 。 设 计 好 页 面 的 总 体 布 局 后 ， 再 癌 页 面 中 添加 动态 对 象 。 

创建 数据 源 及 记录 集 。 数 据 源 可 以 是 一 个 记录 集 对 象 、 返 回 记 录 集 对 象 的 命令 
对 象 ， 也 可 以 是 包含 递交 按钮 的 HTML 表单 或 其 他 元 素 。 完 成 数据 源 的 定义 之 后 ， 在 数据 
绑 定 面板 中 ， 束 能 够 显示 出 相应 的 数据 源 内 容 。 

指定 要 显示 动态 对 象 的 区 域 。 在 页 面 中 绘制 出 要 容纳 动态 对 和 象 的 地 方 。 正 和 常情 
况 下 ， 动 态 对 象 将 被 显示 在 表单 中 。 

动态 对 象 绑 定 。 从 数据 绑 定 面板 中 ， 选 择 要 显示 在 页 面 上 的 动态 对 象 ， 并 皇 入 
到 页 面 中 指定 的 位 置 上 。 这 时 Dreamweaver CSS 会 自 効 向 失 面 中 添加 相応 的 服 各 器 敵 脚本, 
以 实现 动态 对 象 的 显示 。 

添加 服务 融 行 为 。 为 页 面 上 的 动态 对 象 添 加 服务 器 行为 ， 通 过 行为 控制 完成 指 
定 任务 。 

以 上 就 是 构建 一 个 动态 对 象 的 大 致 过 程 ， 其 中 第 4 步 动 态 对 和 象 绑 定 就 是 这 一 六 中 要 介绍 
的 添加 动态 对 象 操作 。 
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1.6.2 


添加 动态 对 象 的 万 法 


在 Dreamweaver CS5 中 ， 可 以 采用 多 种 方法 在 页 面 中 添加 动态 对 象 ， 例 如 ， 可 以 利用 
“ 绑 定 ”面板 添加 动态 对 象 ， 也 可 以 利用 “属性 ”面板 添加 动态 对 象 ， 还 可 以 用 
Dreamweaver CS5“ 文 档 ” 窗 口中 的 菜单 完成 动态 对 象 的 添加 。 在 Dreamweaver CSS 中 ， 在 
页 面 中 添加 动态 对 象 的 基本 方法 如 下 : 

从 “ 绑 定 ”面板 中 选择 要 显示 的 数据 源 项 。 如 果 是 “记录 集 ” 类 型 的 数据 源 ， 
则 选择 其 中 的 学 段 ， 如 果 是 “服务 器 对 象 ” 类 型 的 数据 源 ， 则 选择 数据 源 本 吴 。 

将 选择 的 数据 源 项 拖 忠 到 文档 中 需要 的 位 置 上 ， 或 是 将 插入 点 放 到 文档 中 需要 
的 位 置 ， 再 单 击 “ 绑 定 ” 面 板 上 的 “插入 ”按钮 L_ 搬入 _]。 

当 动 态 对 和 象 被 添加 到 页 面 中 以 后 ， 会 以 占 位 符 的 形式 强 显 示 在 页 面 中 ， 因 为 像 这 种 动态 
对 和 象 会 占据 一 定 的 文档 空间 ， 因 此 将 它 称 为 “ASP 占 位 符 ” 图 1-53 显示 了 插入 <%= 
(conn.Fields.Item(" 产 品 编码 ").Value)%> 数 据 源 时 的 占 位 符 。 



































Dw 文件 (7) 编辑 (EF) ”查看 (Y) 插入 (IT) 修 改 (WW) 格式 (Q) 命令 (C) 站 点 (53) 窗口 (W) 帮助 (TD | 
E:【 出 版 社 * 机 炉 工 下 出 版 社 い 新 建 六 性 実 い 光 癌 い codetchap01 い indez.asp 


| 设计 器 ・ 


indez.asp X 


CIA testDatabase. asp 








标题 : 大 标题 立 档 


LA 设计 | | 实时 代码 に マイ 





| 实时 视图 | 检查 | & ル K つ 。 





pa 地址: Eile:///E 


f 出 版 社 / 机 械 工 业 出 版 社 / 新 建 恕 件 夹 / 光 琢 /code/ chap01; 


BU1 Im 

















RAR ORDER BY [ 广 hpID] DESC" 
conm cmd.Prepared = true 


到 tt 


へ 

使 用 SQL 查询 记录 集 
Set conm = conn cmd.Execute + ca 
cornn numRows = 0 绑 定 记 录 集 ; 
を > 
<IDOCTYPE html PUBLIC "-//W3C//DTD 
XHTML 1.0 Transitional//EN" 
"http: アア mm. パロ FTR/xhtm11/DTD /xhtm 


っ 四半 


ll-transitional. dtd"> 

<html xmlns= 

"http: nrr 。 U3. ロ 0 エア 1999/xhtm1 "> 

<head> 

<meta http-equiv="Content-Type" : 
content="text/html; charset=utf-8" /> | 
<title> 无 标题 次 档 < /jtitle> 
<A/head> 





| ~ Sc 
で 名 


<boady> 

<p> 使 用 sQL 查 询 记 录 集 < jp; 

<p> 堵 定 1 : EE 
EE /p> 

</body> 

</html> 

くき 

conn. Close【(】 

Set conn = Nothing 


















































[mGQ 100% v394 x 463v 2K/1 秒 Unicode (UTF-8) 














图 1-S3 显示 的 动态 对 象 


如 果 插 入 的 动态 对 象 是 Request《〈 请 求 变 量 ) 参数 ， 并 且 指 定 了 集合 类 型 ， 
类 型 .变量 名 } 的 形式 ， 如 {Request.MM user} 。 

如果 没有 指定 Request《〈 请 求 变 量 ) 所 使 用 的 集合 ， 或 是 将 Session (阶段 变量 ) 或 
Application (応用 程 序 変量 ) 参数 作为 活动 内 容 添加 到 文档 中 ， 则 会 采用 {ASP 对 象 名 .变量 
名 } 的 方式 ， 如 {Application.MM user} 。 


则 采用 {集合 
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[Ee 定义 数据 源 


在 将 动态 对 象 添 加 到 网 页 中 以 前 ， 必 须 定 义 一 个 数据 源 来 提供 动态 对 象 。 数 据 源 可 以 是 
记录 集 的 一 个 域 、HTML 表单 的 提交 值 或 是 服务 占 对 象 、 请 求 变 量 、 阶 段 变 量 或 应 用 程序 变 
量 等 。 数 据 源 的 来 源 实际 上 分 为 两 大 类 ， 一 闫 是 记录 集 ， 主 要 以 请 求 变 量 的 形式 出 现 ， 另 一 
类 是 服务 器 对 象 ， 主 要 以 请 求 变 量 、 阶 段 变 量 或 应 用 程序 变量 的 形式 出 现 。 在 “ 绑 定 ”面板 
上 ， 显 示 了 数据 源 的 类 型 ， 如 图 1-54 所 示 。 

记录 集 是 最 常 使 用 的 数据 源 ， 在 ASP 中 ， 记 录 集 是 通过 构建 请 求 变 量 实现 的 。 记 录 
集 可 以 看 成 是 临时 的 数据 表 ， 其 中 的 每 一 列 束 是 一 个 字段 ， 而 每 一 行 束 是 一 条 记录 。 问 
页 面 上 添加 动态 对 象 ， 其 实 束 是 从 记录 集 的 临时 数据 表 中 ， 将 要 显示 的 字段 内 容 放 入 页 
面 的 过 程 。 

国 定义 请 求 变量 的 数据 源 

请 求 变 量 是 ASP 技术 中 用 于 传递 数据 的 最 第 用 的 对 象 ， 它 主要 用 于 从 浏览 占 中 读 取 
递交 的 数据 ， 并 传递 到 服务 器 上 。 定 义 Request (请 求 变 量 ) 类 型 的 数据 源 ， 其 方法 和 步 
又 如 下 : 

在 Dreamweaver CSS 中 打开 一 个 建立 好 的 动态 网 页 ， 选 择 有 菜单 栏 上 的 “和 窗口 ” 
一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 和 面板。 在 数据 “ 绑 定 ”面板 中 单 击 加 号 “+” 按 钮 型 ， 在 打 
开 的 下 拉 末 蛙 中 选择 “请 求 变 量 ” 命 令 ， 如 图 1-55 所 示 。 
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图 1-54 数据 绑 定 面板 中 的 数据 源 图 1-55 ”执行 “请 求 变量 ”命令 


打开 “请 求 变量 ”对 话 框 ， 单 击 “ 类 型 ”文本 框 右边 的 下 拉 三 角 按钮 *， 打 开 
下 拉 六 蛙 ， 从 中 可 以 选择 请 求 变量 要 使 用 的 集合 类 型 ， 如 图 1-56 所 示 。 如 来 选择 “请 求 ” 
选项 ， 则 表明 使 用 默认 集合 ， 即 Request.QueryString 集合 。 

该 下 拉 列 表 中 各 个 选项 的 意义 和 功能 如 下 : 

@ RequestCookie: 用 于 访问 和 存 取 保存 在 浏览 器 病 的 Cookie 数 据 。 

Request.QueryString: 用 于 从 浏览 右 中 读 取 以 GET 方 法 递交 的 数据 。 
Request.Form: 用 于 从 浏览 右 中 读 取 以 POST 方 法 递交 的 数据 。 
Request.ServerVariables: 用 于 获取 服务 需 疾 的 环境 变量 。 
Request.ClientCertificates: 用 于 获取 客户 端的 身份 权限 数据 。 
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选择 完 使 用 的 集合 类 型 之 后 ， 在 “和 名称” 文本 框 中 输入 变量 名 称 ， 如 
“MM user”， 如 图 1-37 所 示 。 











”|Reguaest+t.Cookie 
Eequest. uerystring 
Eequest. Form 
Eequest. ServerVariables 
Reguest. ClientCertificates 








图 1-56 选择 请 求 变 量 类 型 图 1-57 设置 “请 求 变 量 ” 名 称 


设置 完成 后 ， 单 击 “ 人 确定 ”按钮 ， 即 完成 了 数据 源 的 创建 。 同 时 在 “ 绑 定 ” 面 
板 中 将 显示 创建 的 数据 源 名 称 ， 如 图 1-58 所 示 。 重 長 上 面 的 操作 , 可以 添加 多 條 靖 求 変量 
数据 源 。 

国 定义 阶段 变量 的 数据 源 

在 ASP 中 ， 阶 段 变量 主要 用 于 创建 会 话 作用 域 变量 ， 即 同 每 个 用 户 本 身 相关 的 变量 。 
定义 阶段 变量 的 数据 产 ， 其 方法 和 步骤 如 下 : 

选择 菜单 栏 上 的 “窗口 ” ~“ 绑 定 ” 命 令 ， 打 开 “ 绑 定 ” 面 板 。 在 “ 绑 定 ” 面 
板 中 单 击 “ 十 ”号 按钮 天， 在 打开 的 下 拉 沫 单 中 选择 “阶段 变量 ”命令 ， 些 时， 将 打开 “ 阶 
段 变量 ”对 话 框 ， 如 图 1-59 所 示 。 
I = Ns 
+ 一 全 档 办 型 : hsF YEScript 
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图 1-58 ”建立 的 请 求 变 量 数据 源 图 1-59 “阶段 变量 ”对 话 框 





在 “名 称 ” 文 本 框 中 输入 阶段 变量 名 称 ， 如 输入 “MM _user”。 

设置 完成 后 ， 单 击 “ 确 定 ” 鬼 钮 ， 确 认 操 作 ， 则 完成 了 数据 源 的 创建 。 同 时 在 
数据 绑 定 面 板 中 将 显示 创建 的 数据 源 名 称 ， 如 图 1-60 所 示 。 重 复 上 面 的 操作 ， 可 以 诬 加 多 
个 阶段 变量 数据 源 。 

加 定义 应 用 程序 变量 的 数据 源 

在 ASP 中 ， 应 用 程序 变量 主要 用 于 创建 应 用 程序 作用 域 变 量 ， 即 在 整个 应 用 程序 执行 
期 间 所 有 人 都 可 以 使 用 的 变量 。 定 义 应 用 程序 变量 的 数据 源 ， 其 方法 和 步骤 如 下 : 

选择 末 单 位 中 的 “窗口 ”一 “ 绑 定 ”命令 ,打开 “ 绑 定 ” 和 面板 。 在 数据 “ 绑 
定 ” 面 板 中 单 击 “+” 号 按钮 蜀 ， 在 打开 的 下 拉 菜 单 中 选择 “应 用 程序 变量 ”命令 ， 此 时 ， 
将 打开 “应 用 程序 变量 ”对 话 框 ， 如 图 1-61 所 示 。 
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部 定 到 |: 
1-60 ”创建 的 阶段 变量 数据 源 1-61 “应 用 程序 变量 ”对 话 框 

















在 “名 称 ” 文 本 框 中 输入 应 用 程序 变量 名 称 ， 如 “MM user”。 

设置 完成 后 ， 单 击 “ 确 定 ” 投 钮 ， 确 认 操 作 ， 即 完成 了 数据 源 的 创建 。 同 时 在 
数据 绑 定 面板 上 将 显示 创建 的 数据 源 名 称 ， 如 图 1-62 所 示 。 重 复 上 面 的 操作 ， 可 以 诊 加 多 
个 应 用 程序 变量 数据 源 。 
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饰 定 到 |， 
1-62 创建 的 应 用 程序 变量 数据 源 





加 删除 数据 源 

删除 数据 源 的 操作 步 又 如 下 : 

在 数据 “ 绑 定 ”和 面板 中 的 数据 源 列 表 中 ， 选 择 需 要 删除 的 数据 源 。 
单 击 “-” 号 按钮 即 可 完成 删除 操作 。 
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通过 第 1 半 的 学 习 ， 我 们 已 经 掌握 了 动态 网 页 制作 的 基础 知识 ， 也 了 解 到 制作 动态 网 页 
之 前 需要 制作 出 静态 网 页 。 网 页 设计 发 展 到 现在 ， 已 经 使 用 div+CSS 布局 的 Web 2.0 标准 ， 
相对 于 代码 条 理 混 乱 、 样 式 结构 杂乱 的 表格 布局 ，CSS 带 来 了 全 新 的 布局 方法 ， 使 网 页 设计 
更 轻松 、 更 自由 。 本 章 将 详细 介绍 使 用 Web 2.0 标准 设计 网 页 布局 的 方法 ， 为 下 面 动态 功能 
模块 的 建设 做 好 前 期 准备 工作 。 
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div+CSS 布 局 方 法 ] 






































在 XHTML 中 应 用 div+CSS 标签 进行 网 页 布局 是 目前 最 狐 的 网 页 制作 技术 ，Dreamweaver 
CSS 软件 中 也 严格 要 求 使 用 这 种 技术 进行 排版 。 在 这 里 ， 使 用 CSS 代码 控制 布局 可 以 使 网 页 更 
加 符合 Web 2.0 标准 。 


div 标 签 的 CSS 控 制 方 


div 标签 在 Web 2.0 标准 的 网 页 中 使 用 非常 频繁 ， 相 对 于 其 他 XHTML 元素 , div 有 什么 特 
别 之 处 呢 ? 其 实 div 标签 ， 跟 其 他 元 素 类 似 ， 是 一 种 网 页 编排 的 元 素 ， 需 要 通过 使 用 CSS 代 
人 码 ， 对 其 进行 样式 的 控制 。 

div 标签 是 双 标 签 ， 是 以 <div></div> 的 形式 和 存在， 其间 可 以 放置 任何 内 容 ， 包 括 其 他 的 
div 标签 。 也 就 是 说 ，div 标签 是 一 个 没有 任何 特性 的 容器 而 已 。 

创建 一 个 标准 的 XHTML 1.0 文档 ， 命 名 为 divindex.html， 编 写 divindex.html 文件 代码 如 下 : 











<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title>div 标签 </title> 

</head> 

<body> 

<div> 第 1 个 div 标签 </div> 

<div> 第 2 人 div 标签 </div> 

<div> 第 3 个 div 标签 </div> 

<div> 第 4 个 div 标签 </div> 

</body> 

</html> 


建立 站 点 文件 夹 dv， 并 设置 好 HS， 在 浏览 器 地 址 栏 中 输入 http://127.0.0.1/divindex.html， 
有 其 体 浏览 效果 如 图 2-1 所 示 。 

没有 CSS 的 帮助 ，div 标签 没有 任何 特别 之 处 ， 只 是 无 论 如 何 调整 浏览 器 窗口 ， 每 个 
div 标签 都 各 占 一 行 。 即 默认 情况 下 ， 一 行 上 只 能 容纳 一 个 div 标签 。 

那么 怎么 才能 实现 对 div 标签 的 CSS 控制 呢 ? 这 里 通过 id 选择 符 同 div 加入 CSS 代 
価 , 使 div 拥有 背景 色 以 及 宽度 ， 修 改 divindex.html 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transittonal/EN" "http://www.w3. 
org/TR/xhtml1/D1D/xhtml1-transittonal.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
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翅 diz 标 签 一 Nicrosoft Internet Explorer 回回 四 
: 文件 @) 编辑 人 E) 查看 @ 收藏 和 工具 (I) 帮助 由 
Om OO EE Pm km Oo ase 
; 地 址 0) | 緒 ] http: Ar127.0.0. 1/divindex. html ン | 转 到 
第 1 个 div 标 签 
第 2 个 div 标 签 


第 3 个 div 标 答 
第 4 个 div 标 签 


>»> 














移 Internet 


2-1 实例 运行 的 效果 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>div 标签 </title> 
<style type="text/css"> 
#nol,#no2{background-color:#eee; 


} 
#no3,#no4{background-color:#999; 
width:300px: 
} 
</style> 
</head> 
<body> 


<div id="no1"> 第 1 个 div 标签 </div> 
<div id="no2"> 第 2 个 div 标签 </div> 
<div id="mo3"> 第 3 个 div 标签 </div> 
<div id="mo4 ウ 第 4 个 div 标签 </div> 
<7body> 
</html> 


在 浏览 器 地 址 栏 中 输入 http:/127.0.0.1/divindex.html， 浏 览 器 的 运行 效果 如 图 2-2 所 示 。 


确 div 标 等 = icrosoft Internet Explorer 加 回国 
: 文件 ) 编辑 下) 查看 名 ”收藏 史 ) 工具 G) 医 助 ⑪) 如 


OO OO- EO の 款 次 轩 岂 -这 日 : 口 
: 地 址 m) 人 ttp:/7127.0.0. 1/divindex. html  “ 国 转 到 


» 








第 1 个 diy 标 签 
第 2 个 diy 标 签 


入 Internet 


2-2 设置 背景 后 的 div 标签 
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通过 背景 色 的 设置 ， 可 以 看 出 对 div 的 CSS 控制 只 需要 对 需要 控制 的 div 命名 id, 然 后 
写 入 相应 的 CSS 控制 代码 ， 即 可 以 自动 实现 控制 。 但 是 从 图 2-2 中 ， 我 们 可 以 看 到 div 标签 
默认 占据 一 行 ， 宽 度 也 为 一 行 的 宽度 。 通 过 宽度 的 设置 可 以 友 现 ， 并 不 是 因为 div 的 宽度 为 
一 行 ， 导 致 无 法 容纳 后 面 的 div 标签 ， 而 是 无 论 宽度 多 小 ， 一 行 始 终 只 有 一 个 div 标签 ， 读 
者 须 说 记 。 

div 标签 作为 网 页 CSS 布局 的 主要 元 素 ， 其 优势 非常 明显 。 相 对 于 表格 布局 ，div 更 加 
灵活 ， 因 为 div 具 起 一 人 没有 任 何 特性 的 容器 , CSS 可 以 非常 灵活 地 对 其 进行 控制 ， 组 成 
网 页 的 每 一 块 区 域 。 在 大 多 数 情况 下 ， 仅 仅 通 过 div 标签 和 CSS 的 配合 ， 即 可 完成 页 面 的 
布局 。 
































| XHTML 中 的 块 状元 素 和 内 联 元 素 


XHTML 的 布局 核心 标签 是 div，div 属于 XHTML 中 的 块 状元 素 。XHTML 的 标签 默认 
为 两 种 元 素 ， 一 种 是 块 状元 素 ， 男 一 种 是 内 联 元 素 。 

国 块 状元 素 

该 元 素 是 矩形 的 ， 有 上 自己 的 高 度 和 宽度 。 默 认 情 况 下 ， 在 父 容 右 中 占据 一 行 ， 同 一 行 无 
法 容纳 其 他 元 素 及 文本 。 其 他 的 元 素 将 显示 在 其 下 一 行 ， 简 单 地 说 ， 我 们 可 以 看 作 它 们 是 被 
块 状元 素 “ 挤 ”下 去 的 。 块 状元 素 束 是 一 个 矩形 容器 ， 边 缘 非 常 便 ，CSS 设置 了 高 度 和 宽度 
后 ， 形 状 无 法 被 改变 。 

于 内 联 元 素 

和 块 状元 素 相 反 ， 内 联 元 素 没有 固定 形状 ， 也 无 法 设置 宽度 和 高 度 。 内 联 元 素 形状 由 其 
内 含 的 内 容 雇 定 ， 所 以 在 宽度 足够 的 情况 下 ， 一 行 能 容纳 多 个 内 联 元 素 。 如 果 说 块 状 元 素 是 
一 个 “全 盒子 ”那么 内 联 元 素 束 是 一 个 软 软 的 “布袋 子 ”( 形 状 由 内 容 决定 )。 

块 状元 素 适 合 于 大 块 区 域 的 排版 ， 所 以 常用 来 布局 页 面 。 而 内 联 元 素 适 合 于 局 部 元 素 的 
样式 设置 ， 所 以 常用 于 设置 局 部 文学 样式 。 


div 元 素 的 样式 设置 


要 使 用 div 元 素 进 行 网 页 布局 ， 首 先 应 学 会 使 用 CSS 灵活 控制 div 元 素 的 样式 。 本 节 束 
力 绕 几 个 常用 的 实例 来 介绍 div 元 素 的 多 种 样式 设置 ， 使 读者 快速 理解 div 元素 。 

作为 单个 div 元 素 ，width 属性 用 于 设置 其 宽度 ，height 属性 用 于 设置 其 高 度 ， 和 用 像素 
(px) 作为 固定 尺寸 的 单位 。XHTML 元 素 中 设置 样式 的 默认 单位 为 像素 。 

当 单 位 为 百分比 时 ，div 元 素 的 宽度 和 高 度 为 目 适 应 状态 ， 即 宽度 禹 度 适应 浏览 堪 窗 
口 尺 寸 而 变化 。 

在 前 面 创建 的 div 站 点 文件 夹 内 创建 名 为 divset.html 的 文件 ， 编 写 divset.html 文件 代価 
如 下 : 




















































































































<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. 
Ww3.org/TR/xhtmll/DTD/xhtmll -transitional.dtd"> 
<html xmins="http://www.w3.org/1999/xhtml"> 





第 2 草 VVeb 2.0 标 准 静 态 网 页 的 搭建 





<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 设 置 div 样式 </title> 
<style type="text/css"> 
#one { 
background-color: #ccc: 
border:1px solid #000; 
width:200px; 
height:100px: 


} 

#tWO { 
background-color: #Ccc: 
border: 1 px solid #000: 
width:3076: 
height:25%; 

} 

</style></head> 

<body> 





<div id="one"> 固 定 div 的 宽度 和 高 度 </div><hr > 
<div id="two'"> 自 适应 div 的 宽度 和 高 度 </div> 
</body> 

</html> 


这 时 候 的 浏览 效果 如 图 2-3 所 示 。 


gS 二 Hicrosoft Tnternet Explorer 
文件 ) 编辑 下) 查看 他 收藏 各 ) 工具 JT) 大助 出) 
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: 地 址 ) 特 ] http://localhost/ divset. html 
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图 2-3 设置 div 样式 


实例 中 第 1 个 div 宽度 和 高 上 度 国 是， 形成 了 一 个 盒子， 宽度 和 融 度 是 不 可 以 改变 的 。 而 
第 2 个 div 由 于 设置 其 宽度 为 50%， 其 宽度 随 着 浏览 器 宽度 的 变化 而 变化 。 但 是 第 2 个 div 
的 高 度 虽 然 设置 为 25%， 按 理 说 ， 其 高 度 应 该 随 着 浏览 器 高 度 的 变化 而 变化 。 然 而 在 实例 中 
div 高 度 仅 和 文本 高 度 相 当 ， 好 像 高 度 设 置 没 有 起 作用 。 这 是 因为 设置 高 度 目 适 应 有 一 个 前 
提 , div 的 高度 自 造 皮 赴 相対 干 父 容器 的 高度 , 実例 中 div 父 容 器 为 body 或 者 xhtml。body 
或 者 xhtml 在 本 例 中 没有 设置 高 度 ，div 的 高 度 上 日 适应 没有 参照 物 ， 也 束 无 法 生效 。 
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接 下 来 ， 在 CSS 中 为 body 和 xhtml 设置 高 度 ， 就 可 解决 div 的 高 度 自 适应 问题 了 。 将 
body 和 HTML 的 高 度 直接 设置 为 100% 即 可 ， 不 会 对 页 面 有 任何 影响 。 在 编码 中 的 CSS 部 
分 加 入 如 下 代码 : 


xhtml,body{height: 100%;} 


为 了 考虑 多 种 浏览 器 的 兼容 性 ， 将 xhtml 和 body 同时 设置 为 100% 宽 度 。 浏 览 器 的 浏览 
效果 如 图 2-4 所 示 。 
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图 2-4 为 div 标签 设置 高 度 适 应 后 的 效果 





调整 浏览 器 高 度 后 ， 第 2 个 div 的 高 度 随 之 变化 。 各 种 浏览 器 对 XHTML 和 CSS 的 解析 
方式 有 差异 ， 在 后 面 的 章节 中 将 详细 讨论 解决 浏览 器 兼容 性 问题 的 解决 办 法 。 














由 于 网 页 访问 者 的 电脑 显示 分 辨 率 各 不 相同 ， 第 见 的 显示 分 辨 率 〈 单 位 : 像素 ) 
为 800x600、1024x768、1280x1024 等 。 所 以 在 布局 页 面 时 ， 要 充分 考虑 到 页 面 内 容 
的 布局 宽度 ， 一 旦 内 容 宽度 超过 显示 宽度 ， 页 面 将 出 现 水 平 滩 动 条 。 对 于 页 面 的 高 
度 ， 一 般 由 页 面 内 容 决 定 。 网 页 布局 应 符合 浏览 者 的 习惯 ， 应 尽量 保证 网 页 只 有 垂直 
滚动 条 。 

页 面 布 局 宽度 一 般 考 虑 最 小 显示 分 辩 率 的 浏览 用 户 ， 近 些 年 的 显示 器 的 显示 分 辨 率 最 
小 为 800x600 (15 寸 CRT 显示 器 )， 其 最 小 宽度 为 800 像 系 。 浏 览 器 的 边框 及 滚动 条 部 分 
约 占 24 像素 左右 ， 所 以 布局 宽度 为 分 辨 率 的 水 平 像素 减 去 24 像素 。 所 以 过 去 网 页 布局 宽 
度 一 般 六 778 像素 ， 再 宽 就 会 使 页 面 产 生 水 平 深 动 条 。 由 于 计算 机 设备 的 飞速 发 展 ， 现 在 
使用 800x600 显示 分 辩 率 的 用 户 已 经 很 少 了 ， 现 在 页 面 布局 宽度 最 大 不 超过 1002 一 1003 
像素 (考虑 到 最 小 宽度 1024 像素 ， 即 1024x768 显示 分 辩 率 )。 网 页 的 宽度 设计 效果 ， 如 
2-5 所 示 。 
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定义 宽 为 778 或 者 1002 像素 


汪 网 站 钟 设 、 网 抽 设 计 、 网 页 刺 作 、 城 名 申请 、 友 拓 空 间 、 网 站 推广 。 icrosoft Tnterne 
文 ) 描記 傘 者 | 誠 基 A D 生 Rb) 
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图 2-5 网 页 的 宽度 设计 


oi 水 平 居 中 显示 J 


制作 网 页 时 ， 通 第 需要 将 整个 网 页 的 内 容 在 浏览 喜 中 居中 显示 ， 使 用 XHTML 表格 布局 
页 面 时 ， 只 需 将 布局 表格 的 align 属性 设置 为 center 即 可 。 而 div 居中 没有 属性 可 以 设置 ， 只 
能 通过 CSS 控制 其 位 置 。 在 布局 页 面前 ， 网 页 设计 者 一 定 要 把 页 面 的 默认 边 距 清除 。 为 了 
方便 操作 ， 常 用 的 方法 是 将 所 有 对 象 的 边 距 清 除 ， 即 设置 margin 属性 和 padding 属性 。 
margin 属性 代表 対象 的 外 辺 嘘 (上 、 下 、 左 、 右 ), padding 属性 代表 対象 的 内 辺 嘘 , 也 叫 填 
充 (上 、 ト 、 左 、 右 )。 marsin 属性 和 padding 属性 类 似 于 表格 单元 格 的 cellspacing 属性 和 
cellpadding 属性 ， 不 过 margin 属性 和 padding 属性 作用 于 所 有 块 状元 素 。 

使 div 元素 水平 大 中 的 方 法 有 多 和 , 常用 的 方 法 走 用 CSS 设置 div 的 左右 边 距 ， 即 
margin-left 属性 和 margin-right 属性 。 当 设置 div 左 外 边 距 和 右 外 边 距 的 值 为 auto， 即 自动 
时 ， 左 外 边 距 和 右 外 边 距 将 相等 ， 即 达到 了 div 水 平 居 中 的 效果 。 

在 站 点 dv 目录 下 创建 网 页 XHTML 1.0 文件 ， 命 名 为 divalign.html， 编 写 divalign.html 
文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 水 平 居 中 </title> 

<style type="text/css"> 

xhtml,body {height: 100%;! 


*{margin:Opx; 























padding:Opx: 


} 
#web {width:75%; 
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height: 100%; 
background-color:#ccc; 
border: lpx solid #000: 
margin-left:auto; 
margin-right:auto; 

} 
</style> 
</head> 
<body> 
<div id="web"> 这 里 是 整个 网 页 的 内 容 </div> 
</body> 
</html> 


在 浏览 器 地 址 栏 中 输入 http://127.0.0.1/divalign.html， 浏 览 效果 如 图 2-6 所 示 。 


请 水 手 居 中 二 HiCrosOfL Tnternet Ezplorer 
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: 地 址 0) 入 | http: 7/7127.0.0. 1/divalign. htm1 
肥 昌 是 本 不 网 页 的 内 容 








图 2-6 设置 水 平 居 中 的 效果 
设置 外 边 距 的 CSS 代码 可 以 进一步 简化 ， 使 用 margin 属性 ， 编 码 如 下 : 


margin:Opx auto; 


说 明 : 
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margin 属性 值 后 面 的 0 代表 上 边 距 和 下 边 距 为 0 像 系 , auto 代表 左边 距 和 右边 距 为 


auto， 即 自动 设置 。 这 里 Opx 和 auto 之 间 使 用 空格 符号 分 隔 ， 而 不 是 过 号 。 


2.1.6 _ div 的 其 套 ] 











为 了 实现 复 淋 的 布局 结构 ，div 也 需要 互相 内 僚 。 不 过 在 布局 负面 时 应 尽量 少 欣 套 ， 
为 XHTML 元 素 多 各 欣 人 套 ， 将 影响 浏览 占 对 代码 的 解析 速度 。 在 div 站 点 文 件 夹 中 ， 创 建 


XHTML 1.0 标准 文档 ， 命 名 为 divindiv.html， 编 写 divindiv.html 文件 代码 如 下 : 
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<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtmll/DTD/xhtmll -transitional.dtd"> 
< く html xmlns="http://www.w3.org/1999/xhtml"> 


<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> ©) 

<title>div 和 骨 食 </title> 

<style type="text/css"> 

*#{margln:OpX; 

padding:Opx: 
} 

#web {width:778px; 
height:500px: 
background-color:#Ccc: 
margin:Opx auto: 

} 

#banner{width:300px: 
height:250px: 
background-color:#cee: 
border:1px solid #000: 
margin:Opx auto; 

} 

#foot{ width:500px; 
height:250px: 
background-color:#cee: 
border: 1px solid #000: 
margin:Opx auto; 

} 

</style></head> 

<body> 

<div 1d="web"> 

<div 1d="banner">banner</div> 
<div 1d="foot">foot</div> 
</div> 

</body> 

</html> 


本 实例 综合 了 居中 的 知识 ， 内 部 的 2 个 div 水 平 居中 在 其 父 容器 (外 部 div) 中。 在 浏 
览 器 地 址 栏 中 输入 http:/127.0.0.1/divindiv.html， 浏 览 效 果 如 图 2-7 所 示 。 


div 的 浮 动 - 


通过 div 布局 网 页 ， 结 果 是 一 个 div 标签 占据 一 行 ， 怎 样 才能 够 实现 布局 中 并 列 的 2 块 
区 域 叫 ? 块 状元 素 有 一 个 很 重要 的 “float” 属 性 ， 可 以 使 多 个 块 状 元 素 并 列 于 一 行 。float 属 
性 也 被 称 为 浮动 属性 ， 对 前 面 的 div 元 素 设 置 浮动 属性 后 ， 当 前 面 的 div 元 素 留 有 足够 的 罕 
白 宽 度 时 ， 后 面 的 div 元素 閣 自 効 浮上 来 , 和 前 面 的 div 元 素 并 列 于 一 行 。float 属性 的 值 为 






























left、right、none 和 inherit。 
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图 2-7 div 髓 套 效 果 
@ float 属性 值 为 inherit 时 ， 这 是 继承 属性 ， 代 表 继 承 父 容器 的 属性 ; 
@ float 属性 值 为 none 时 ， 块 状元 素 不 会 浮动 ， 这 也 是 块 状元 素 的 默认 值 ; 
@ float 属性 值 为 left 时 ， 块 状元 素 将 向 左 浮动 ; 
@ float 属性 值 为 right 时 ， 块 状元 素 将 向 右 浮动 。 
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在 使 用 的 时 候 要 使 两 个 div 并 列 于 一 行 的 前 提 是 ， 这 一 行 有 足够 的 宽度 容纳 两 个 div 的 





宽度 。 下 面 我 们 以 实例 的 形式 讲解 div 的 浮动 设置 ， 有 基体 步骤 如 下 : 
打开 Dreamweaver CS5， 创 建站 点 div， 站 点 的 属性 设置 如 图 2-8 所 示 。 


靖 点 误 置 对 兽 divw 





Drearrweawer 站 点 是 隅 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Crearmweaver 
帳 点 通常 包 信 同和 電 部分: 可 在 其 中 和 存 情 和 处理 奖 件 的 计算 机 上 的 本 地 奖 件 
卖 ， 以 名 可 在 其 中 将 相同 区 件 支 布 到 Wweb 上 的 服务 器 上 的 远程 芝 件 夹 。 





您 可 以 在 此 处 当 Dreamweawer 站 点 选择 未 地 辫 件 夹 和 略称 。 
站 点 名 称 ， 
素 地 站 点 立 件 垃 ; 円 





图 2-8 定义 div 站 所 
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创建 后 ， 新 建立 一 个 网 页 文件 (XHTML 1.0)， 命 名 为 divfloat.html， 编 写 文件 
代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. : 
org/TR/xhtml1/DTD/xhtmll-transitional.dtd" テ > 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 设 置 div 浮动 </title> 
<style type="text/css"> 
*{ margin:0px; 
padding:Opx: 
} 
#first{ width: 150px; 
height:100px: 
background-color:#Ccc: 
border:1px solid #000: 
float:left: 
} 
#second{ width: 180px; 
height: 1 00px; 
background-color:#eee; 
border: lpx solid #000; 
} 
</style></head> 
<body> 
<div id="first"> 第 1 个 div</div> 
<div id="second"> 第 2 个 div</div> 
</body> 
</html> 


实例 中 将 两 个 div 设置 为 不 同 的 宽度 和 不 同 的 背景 色 ， 在 浏览 需 地 址 栏 中 输入 
http://127.0.0.1/divfloat.html， 浏 览 效果 如 图 2-9 所 示 。 
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图 2-9 设置 div 左 浮动 的 效果 









只 设置 了 第 1 个 div 元素 向 左 浮 効 , 第 2 个 div 元 素 “ 流 ”上 来 了 ， 并 紧 换 看 





第 1 个 div 元 素 。 接 下 来 设置 第 2 个 div 向 右 浮动 ， 代 人 码 如 下 : 


#second {width:180px; 
height: 1 00px; 
background-color:#eee; 
border:1px solid #000; 
float:right 


) 


在 浏览 器 地 址 栏 中 输入 http:/127.0.0.1/divfloat.html， 浏 览 


地 设置 diw 沪 动 一 icrosoft Internet Eznlnrer 
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并 Internet 


图 2-10 div 左 浮 効 和 右 浮 効 





修改 后 第 2 个 div 紧 挨 着 其 父 容器 〈 浏 览 器 ) 的 右边 框 ， 这 两 个 div 元素 也 可 


以 换个 位 置 ， 即 设置 CSS 代 偶 如 下 : 


*{ margin:0px; 

padding:0px; 
} 

#first{ width: 150px; 
height: 100px; 
background-color:#ccc; 
border:1px solid #000: 
float:right: 

} 

#second {width:180px; 
height:100px: 
background-color:#cee: 
border:1px solid #000; 
float:left 


} 
浏览 器 中 的 浏览 效果 ， 如 图 2-11 所 示 。 
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效果 如 图 2-10 所 示 。 
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图 2-11 交換 div 浮动 方向 

















浮动 属性 是 CSS 布局 的 利器 ， 可 以 通过 不 同 的 浮动 属性 值 灵活 地 定位 div 元 素 ， 以 达到 
灵活 布局 网 页 的 目的 。 块 状元 素 〈 包 括 div) 浮动 的 范围 ， 由 其 父 容器 所 决定 ， 本 实例 中 div 
元 素 有 的 父 容器 就 是 body 或 html。 

为 了 更 加 灵活 地 定位 div 元 素 ，CSS 提供 了 clear 属性 。clear 属性 的 值 为 none、left、 
right 和 both， 默 认 值 为 none。 当 多 个 块 状元 系 由 于 第 1 个 元 素 设 置 了 浮动 属性 而 并 列 时 ， 
如 果菜 个 元 率 不 需要 被“ 流 ” 上 去 ， 即 可 设置 相应 的 clear 属性 。 

在 站 点 文件 夹 内 创建 XHTML 1.0 文件 ， 命 名 为 divclearhtm， 编 写 文 件 代 码 
如 下 : 
































<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. 
Ww3.org/TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title>div 的 清 除 属 性 <7title> 

<style type="text/css"> 

*{ margin:0px; 

padding:Opx: 
} 

.web {width:S00px; 
height:100px: 
background-color:#Ccc: 
margin:Opx auto: 
} 

.One,.two,#threel] ,#three2,#three3,#three4 {width: 150px; 
height:30px: 
background-color:#cee: 
border:1px solid #000; 
} 

.one {float:left;} 

.two {float:right;} 

#threel {clear:none;} 









#three2 {clear:right; 
#three3 {clear:left; 
#three4 {clear:both;} 
</style></head> 
<body> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div class="two"> 第 2 个 div</div> 
<div id="three1 "> 第 3 介 div (clear:none;) </div> 
</div> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div class="two"> 第 2 个 div<7div> 
<div id="three2"> 第 3 條 div (clear:right: ) div> 
</div> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div id="three3"> 第 3 个 div (clear:left;) </div> 
<div class="two"> 第 2 个 div</div> 
</div> 
<div class="web"> 
<div class="one"> 第 1 个 div</div> 
<div id="three4"> 第 3 个 div (clear:both;) </div> 
<div class="two"> 第 2 个 div</div> 
</div> 
</body> 
</html> 


在 TE 浏览 器 地 址 栏 中 输入 http:/127.0.0.1/divclearhtml, 接 《Enter〉 键 ， 浏 


效果 如 图 2-12 所 示 。 
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图 2-12 div 清除 属性 
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:全 = 庆 和 VVeb 2.0 标 准 静 态 网 页 的 搭建 





通过 前 面 综合 学 习 布局 知识 ， 读 者 已 经 初步 掌握 了 使 用 div+CSS 进行 布局 的 基础 知识 ， 
本 节 将 制作 一 个 典型 的 网 页 布局 实例 。 该 实例 要 求 页 面 有 上 下 4 行 区 域 ， 分 别 用 作 广 告 区 、 
导航 区 、 主 体 区 和 版 权 信 息 区 。 而 主体 区 又 分 为 左右 2 个 大 区 ， 左 区 域 用 于 文章 列表 ， 石 区 
域 用 于 6 个 主体 内 容 区 。 布 局 区 域 比较 多 ， 用 表格 布局 需要 很 多 行 代 人 码 才 能 完成 。 利 用 div 
和 CSS 可 以 很 好 地 完成 ， 并 且 代 人 码 比 较 人 简练 。 

根据 实例 要 求 作 图 ， 并 分 析 布 局 的 结构 ， 从 而 方便 编写 div 布局 的 结构 代码 ， 这 里 做 分 
析 图 ， 如 图 2-13 所 示 ， 并 在 每 个 区 域 做 了 id 命名 (# 符 号 井 共 ), 以 方 便 div 编写 。 
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图 2-13 网 页 布局 结构 分 析 


从 分 析 图 中 可 以 看 清 整 个 页 面 的 结构 ， 其 中 ，#top 代表 广告 区 、 因 av 代表 导航 区 、 
#mid 代表 主体 区 、 前 eft 代表 #mid 所 包含 的 左 区 域 、 導 ight 代表 #mid 所 包含 的 右辺 区 域 、 
#bottom 代表 版权 信息 区 。 

#right 区 域 包含 6 个 具体 内 容 区 ， 由 于 这 些 内 容 区 的 尺寸 相同 ， 所 以 在 实例 中 将 会 使 用 
class 选择 符 作 为 统一 样式 ， 对 这 6 个 区 域 进行 CSS 样式 指定 。 根 据 结构 分 析 图 编写 
XHTML 部 分 的 结构 代码 如 下 : 





<div id="top">banner 区 域 </div> 
<div id="nav"> 导 航 区 </div> 
<div 1d="mid"> 
<div id="left"> 纵 向 左 导航 区 </div> 
<div 1d="right"> 
<div class="content"> 内 容 A</div> 
<div class="content"> 内 容 B</div> 
<div class="content"> 内 容 C</div> 
<div class="content"> 内 容 D</div> 
<div class="content"> 内 容 E</div> 


<div class="content"> 内 容 F</div> 
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</div> 
</div> 
<div id="bottom"> 底 部 版 权 区 </div> 


这 里 在 6 个 具体 内 容 区 域 ， 用 了 同一 个 class 名 称 的 选择 符 ， 用 于 在 CSS 中 指定 统一 的 样 
式 。 在 Di:\web\ 目 录 下 创建 网 页 文件 XHTML 1.0)， 命 名 为 div page.htm， 编 号 dv page.htm 文 
件 代 码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 网 页 布局 实例 <title> 
<style type="text/css"> 
"1 
margin:O0px; 
padding:Opx: 
} 
#top,#nav,#mid,#bottom { 
width:778px; 
margin:Opx auto; + 
#tOD 1 
height:SOpx: 
background-color:#00FFO0:! 
#nav{ 
height:30px: 
background-color:#3333FF:\ 
#md { 
height:350px:! 
#left{ 
width:194px: 
height:350px: 
border: 1px solid #999: 
float:left: 
background-color:#FF3333;} 
#right{ 
height:350px: 
background-color#CCCCO00:) 
.COntent1 
width:191px: 
height:174px: 
background-color:#FFEFFO0: 
border:lpx solid #999: 
float:left; 
#content2 1background-color#FFOOFE:!\ 
#bottom{ height:80px; 
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background-color:#00FFFF:) 
</style> 
</head> 
<body> 
<div id="top">banner 区 . 域 </div> 
<div id="nav"> 导 航 区 </div> 
<div 1d="mid"> 
<div id="left"> 纵 问 导 航 区 </div> 
<div 1d="right"> 
<div class="content"> 内 容 A</div> 
<div class="content" id="content12"> 内 容 B</div> 
<div class="content"> 内 容 C<7div> 
<div class="content" id="content2"> 内 容 D<7div> 
<div class="content"> 内 容 E</div> 
<div class="content"' id="conten12"> 内 容 F</div> 
</div> 
</div> 
<div id="bottom"> 底 部 版 权 区 </div> 
</body> 
</html> 


这 里 稍微 修改 了 XHTML 部 分 的 代码 ， 选 择 了 4 个 具体 内 容 区 域 ， 加 上 了 id 名 称 为 content2 
的 属性 ， 这 是 为 了 使 这 4 个 区 域 有 不 同 的 背景 色 。 在 浏览 右 地 址 栏 中 输入 http:/localhost/ 
div_page.htm， 浏 时 效果 如 图 2-13 所 示 。 

本 例 综合 了 前 面 的 布局 知识 ， 如 居中 等 。 由 CSS 代码 可 得 ， 主 体内 容 区 (id 名 称 为 mid) 
的 宽度 是 778 像 奈 , 高度 古 350 像素 。 

主体 内 容 区 (id 名 称 为 mid) 的 宽度 与 高 度 为 什么 会 与 内 侣 的 div 冤 度 有 依 天 呢 ? 这 涉 
及 浏览 喜 解 机 CSS 时 对 宽度 和 高 度 的 计算 方法 ， 正 7.0 及 以 上 版 本 的 浏览 右 和 FireFox 浏览 
器 ， 解 析 div 的 客 上 度 和 蜗 度 设置 值 并 不 包括 边框 。 由 CSS 代码 可 得 ， 纵 问 导 航 区 《id 名 称 为 
left) 和 具体 内 容 区 (class 名 称 为 content) 的 边框 宽度 1 

宽度 和 高 度 的 计算 是 合理 布局 页 面 的 基 
偶 ， 一 旦 计算 有 误 将 导致 页 面 布 局 混乱 。 并 
且 针 对 不 同 浏 览 右 有 不 同 计算 方法 ， 本 书 实 
例 使 用 正 6.0 浏览 器 ， 后 面 草 节 中 将 介绍 不 
同 浏 览 器 莱 容 性 的 解决 办 法 。 


注意 : 

在 宽度 和 高 度 的 计算 中 ，IE 6.0 以前 
版 本 的 浏览 器 ， 解 析 div 的 宽度 和 高 度 设 
置 值 包 括 边 框 ， 如 果 读 者 使 用 的 是 TE 6.0 
以 前 版 本 的 浏览 器 ， 可 以 尝试 修改 宽度 
值 ， 以 达到 图 2-14 的 效果 。 





























马 网 页 布局 充 人 网 - Hicrorstt Internet Kxploror EE 
文 们 四 本 本 加 奏者 Y) で 放 ⑪ IAT) EMD » 
Or OO MAO Phim oS る © るる 


tip HET SS も ver hai On NN = Gm or 














2-14 网 页 布局 实例 








ンク 





アオコ Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 





EEZ 列表 元素 布 局 


介绍 完 div+CSS 的 网 页 整体 结构 布局 后 ， 还 需要 治 握 列表 元 取 的 使 用 方法 。Web 2.0 标 
准 的 XHTML 一 个 很 重要 的 原则 就 是 ， 使 用 合适 的 标签 组 成 页 面 结构 。 合 适 的 标签 指标 签 有 
语义 ， 并 且 条 理 清晰 ， 可 谈 性 好 。 所 以 ， 页 面 大 块 区 域 的 布局 一 般 使 用 div 元 系 ， 但 在 东 些 
区 域 (如 导航 条 ) 可 以 考虑 使 用 其 他 元 素 ， 如 使 用 比较 广泛 的 列表 元 又 。 


ンク 列表 元 素 制作 导航 条 









































在 传统 的 HTML 页 面 制作 中 ， 列 表 元 素 使 用 并 个 多 ， 而 在 CSS 的 帮助 下 ， 列 表 元 又 








变 得 空前 强大 ， 其 至 应 用 于 小 区 域 布局 。 列 表 元 素 的 ji 是 块 状元 票 ， 所 以 有 宽度 和 局 度 
设置 ， 并 且 可 以 通过 浮动 属性 的 设置 使 多 个 li 元 系 并 排 。 这 种 结构 非常 适合 网 页 的 导航 
条 布局 。 

由 于 在 页 面 布局 时 列表 元 素 不 需要 编号， 所 以 列表 元 了 林 更 多 使 用 ml 标签 。 

在 D:vweb\ 目 录 下 创建 网 页 文件 (XHTML1.0)， 命 名 为 nav ul.htm， 编 写 nav ul.htm 文 
件 代 人 码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 导 航 条 制作 </title> 

<style type="text/css"> 




















*{ margin:0px; 
padding:Opx:) 
#naV 1 
width:500px: 
height:20px: 
margin:Opx auto: 
backgeround-color#FF9900:) 
li{ width:123px: 
height:20px: 
border:1px solid #0000FF: 
text-aliegn:center: 
float:left:) 
</style> 
</head> 
<body> 
<ul id="nav"> 
> 痛 内 ロッ 
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<]i> 新 闻 </ > 
<1i> 联 系 我 们 </Ii> 
<] 谊 留言 板 </li> 
</ul> 

</body> 

</html> 


为 了 更 方便 看 到 导航 条 的 表现 ， 在 这 里 ， 笔 者 将 ul 设置 成 桶 黄色 背景 色 ， 并 将 Hi 设置 成 
蓝 色 边框 ， 在 浏览 器 地 址 栏 中 输入 http:Vlocalhostnav ulLhtm， 浏 览 效 果 如 图 2-15 所 示 。 
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图 2-15 ”导航 条 布局 


导航 条 的 制作 


在 实际 操作 中 ， 为 了 增加 导航 条 的 互动 ， 列 表 元 到 沿 常 配合 超 链 接 元 素 一 起 使 用 。 超 链 
接 有 伪 类 选择 从 ， 可 以 呈现 链接 文学 和 用 户 互 动 的 4 个 状态 ， 即 未 访问 前 、 忌 标清 过 、 鼠 标 
单 击 时 和 被 访问 后 。 其 实 Web 2.0 标准 中 ， 不 WA li 等 其他 元素 同 
样 有 :hover 和 :active 这 两 个 伪 类 选择 符 ， 只 是 正 浏览 器 只 文 持 超 链接 元 又 的 伪 关 选择 符 。 为 
了 兼容 正 浏览 右 ， 只 得 配合 超 链 接 制 作 互动 导航 条 。 

说 明 : 

FireFox 浏览 器 比 正 浏 览 器 更 接近 Web 标准 的 代码 解析 ， 所 以 FireFox 浏览 器 支持 其 
元 素 的 伪 类 选择 符 


虽然 超 链接 元 素 是 内 联 元 素 ， 但 在 本 例 中 ， 这 里 用 CSS 代码 将 其 转换 为 块 状元 素 ， 然 
后 设置 其 党 度 和 高 上 度 。 这 样 束 不 需要 设置 li 元素 的 样式 了 ， 只 要 设置 fi 元素 的 浮动 属性 ， 束 
可 以 使 fi 元素 并 列 捍 放 。 在 Dweb\ 目 录 下 创建 网 页 文件 (XHTML1.0)， 命 名 为 
nav ul a.htm， 编 写 nav ul a.htm 文件 代码 如 下 : 















































<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 导 航 条 制作 </title> 

<style type="text/css"> 





2 








*{margin:OpxX; 
padding:Opx:) 
ul1list-style:none:}) 
#naviwidth:500px: 
height:20px: 
margin:Opx auto: 
background-color:#FF9900:) 
li{float:left;} 
li aidisplay:block: 
width:117px: 
height:20px: 
border:1px solid #0000FF: 
margin-left:Spx; 
font-weight:bold; 
text-decoration:none: 
text-align:center: } 
li a:link{ 
background-color:#990000; 
color:#9900FF;} 
li a:hover{background-color:#00CCO0; 
color:#FFFFOO;} 
li aactive1background-color#FFO0000:) 
li a:visited {background-color:#00FFO0O0;} 
</style> 
</head> 
<body> 
<ul id="nav"> 
マロ > 
<a href="#" title=" 这 是 网 站 上 页 "> 首页 </a> 
マル > 
マロ > 
<a href="#" title=" 这 是 新 闻 的 链接 "> 新 闻 </a> 
マル > 
< ロン 
<a hre 人 ="#" title=" 这 是 沟通 的 渠道 "> 联系 我 们 </a> 
マル > 





<li> 
<a hre 人 ="#" title=" 这 是 留言 的 链接 "> 留言 板 </a> 
</li> 
</ul> 
</body> 
</html> 
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为 了 更 方便 看 到 导航 条 的 表现 ， 这 里 将 ul 设置 为 杰 色 背景 色 ， 并 将 超 链接 元 系 设 置 为 














蓝 色 边框 。 在 不 同 状态 下 ， 超 链接 以 及 内 售 文 本 有 不 同 凑 色 。 在 浏 
http://1ocalhostnav ul ahtm， 浏 览 效 果 如 图 2-16 所 示 。 





a 
リリ 


策 地 址 芒 中 输入 
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钨 | file: /iD:/ 绕 习 做 的 diwi 到 表 元 素 布 局 /nav_ul_a. html# 


图 2-16 制作 互动 导航 条 





导航 条 的 互动 布局 


该 者 可 能 有 疑惑 ， 既 然 超 链接 转换 为 块 状元 素 了 了， 为 什么 4 个 超 链 接 区 域 块 可 以 并 列 于 
一 行 呢 ?这 是 因为 虽然 超 链接 块 没 有 设置 浮动 属性 ， 但 其 直属 的 父 容器 ， 即 li 元 素 设 置 了 学 
动 属性 ， 所 以 实际 是 4 个 li 元素 并 列 。 通 过 引入 超 链 接 的 伪 类 选择 符 ， 导 航 条 有 了 互动 性 。 
根据 用 户 不 同 的 操作 ， 超 链接 可 呈现 出 不 同 的 样式 ， 如 背景 色 的 改变 和 文本 颜色 的 改变 。 为 
了 使 超 链 接 的 文本 更 突出 ， 本 例 使 用 了 font-weight 属性 ， 设 置 其 值 为 bold， 即 使 文本 加 粗 。 
通过 将 text-decoration 属性 设置 为 none， 去 除了 超 链接 默认 的 下 划 线 。 

为 了 导航 条 各 子 项 不 至 于 过 于 拥挤 ， 本 例 中 使 用 了 margin-left 属性 , 即 左辺 距 , 使 毎 人 
超 链接 块 都 有 5 像素 的 左边 距 。 考 虑 到 边 距 、 超 链接 块 的 宽度 和 边框 粗细 ，ul 元 素 宽 度 设 置 
为 425 像素 ， 即 图 2-16 中 的 黄色 部 分 。 


注意 : 
通常 网 页 设计 中 很 少 使 用 ul 元 素 的 列表 符号 ， 所 以 把 ul 标签 选择 符 的 ist-style 属性 设 
置 为 none， 表 示 页 面 中 任何 Ul 列表 结构 都 没有 列表 符号 。 
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CSS 盒 模型 


CSS 盒 模型 ， 对 于 使 用 div+CSS 布局 的 方法 来 说 是 非常 重要 的 概念 ， 因 为 盒 模型 是 CSS 
定位 布局 的 核心 内 容 。 读 者 学 习 了 布局 网 页 的 基本 方法 ， 只 需 利 用 div 元 素 和 列表 元 素 ， 即 
可 完成 页 面 大 部 分 的 布局 工作 。 但 是 前 面 学 习 的 知识 更 注重 实践 操作 ， 读 者 并 不 理解 布局 的 
原理 ， 常 常 在 布局 页 面 的 过 程 中 ， 会 遇 到 无 法 理解 的 问题 。 学 习 完 本 节 的 盒 模型 的 知识 后 ， 
读者 将 拥有 较 完 善 的 布局 观 ， 基 本 可 做 到 使 用 代码 完成 div+CSS 的 布局 操作 。 


于 Css 含 模型 的 概念 


XHTML 中 的 大 部 分 元 又 《特别 是 块 状元 素 )， 六 可 以 看 作 是 一 个 合子， 而 网 页 元 素 的 
定位 ， 实 际 束 是 这 芋 大 大 小 小 的 盒子 在 页 和 面 中 的 定位 。 当 茶 个 块 状元 素 被 CSS 设置 了 浮动 
属性 ， 这 个 盒子 贺 会 日 动 的 排 到 上 一 行 。 网 页 布局 即 关 注 这 坚 盒 子 在 页 面 中 如 何 摆 放 、 如 何 
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骨 套 的 问题 ， 而 这 么 多 盒子 摆 在 一 起 ， 最 需要 关注 的 是 盒子 太 寸 计算 和 是 否 流动 等 要 素 。 为 
什么 要 把 XHTML 元 素 作 为 盒 模型 来 研究 呢 ? 因 为 XHTML 元 率 的 特性 和 一 人 信子 非 常 相 
似 ， 盒 子 里 面 的 内 容 到 盒子 的 边框 之 间 的 距离 即 填 充 (padding ); 盒子 本 身 有 边框 
(border); 例子 边框 外 和 其 他 盒子 之 间 有 边界 margin)， 盒 模型 示意 图 如 图 2-17 所 示 。 

大 多数 XHTML 元 素 的 结构 都 类 似 于 图 2-17 所 示 ， 除 了 包含 的 内 容 (文本 或 图 片 ) 
外 ， 还 有 内 边 距 、 边 框 和 外 边 距 一 层 层 的 包 圳 。 读 者 在 布局 网 页 和 定位 XHTML 元 素 时 要 充 
分 若 碟 到 这 些 要 系 ， 才 可 以 更 加 目 如 地 摆 放 这 些 例子 。 
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< ps 




















\padding ( 内 边 距 ) 
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人 border (边框 ) 








图 2-17 使 模 型 示意 图 





外 边 距 属性 即 CSS 的 margin 属性 , CSS 中 可 拆 分 为 margin-top (頂部 外 辺 距 )、margin- 
bottom (的 部 外 边 距 )、margin-left( 左 边 外 边 距 ) 和 margin-right (右辺 外 辺 距 )。CSS 的 边 
框 属性 (border) 和 内 辺 距 属性 て padding) 同样 可 拆 分 为 4 边 。 在 Web 2.0 标准 中 ，CSS 的 
width 属性 即 为 盒子 所 包含 内 容 的 宽度 ， 而 整个 盒子 的 实际 宽度 即 为 : 

盒子 宽度 - 

padding-left+border-left+margin-left+width+padding-right+border- right+margin-right 

相应 地 ，CSS 的 height 属性 即 力 食 子 所 包 信 内容 的 高度 , 面 整 介 盆 子 的 突 陸 高度 即 訪 : 

盒子 高 度 - 
margin-top+border-top+padding-top+height+padding-bottom+border-bottom+margin-bottom 

全 模型 在 使 用 的 过 程 中 ， 还 要 注意 以 下 几 扣 : 

(1) 边界 值 可 为 负 值 ， 但 随 着 浏览 器 的 不 同 显示 可 能 会 不 一 样 ; 

(2) 填充 值 不 可 以 为 负 值 ; 

(3) 对 于 块 级 元 素 ， 未 浮动 的 垂直 相 邻 元 对 的 上 边界 和 下 边界 会 被 压缩 。 

(4) 对 于 浮动 元 么 ， 边 界 不 压 给， 且 符 浮动 元 素 不 声明 宽度 ， 则 其 宽度 趋同 于 0。 

(5) 如 条 全 中 没有 任何 内 容 ， 不 管 宽 度 和 高 度 设 置信 为 多 少 ， 都 不 会 被 显示 。 


外 边 距 的 控制 


在 CSS 中 , margin 属性 可 以 统一 设置 ， 也 可 以 上 下 左右 分 开设 置 。 在 D:\web\ 目 录 下 创 
建 网 页 文件 (XHTML1.0)， 命 名 为 box_margin.htm， 编 写 box margin.htm 文件 代码 如 下 : 
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<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transittonal/EN" "http://www.w3. 
org/TR/xhtmll/DTD/xhtmll -transitional.dtd"> 
< く html xmlns="http://www.w3.org/1999/xhtml"> 


く head> 」 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> > 
<title> 外 边 距 设置 </title> 
<style type="text/css"> 
*{ margin: Opx;} 
#all{ width:600px; 
height:500px: 
margin:Opx auto; 
background-color:#FF9900:! 
#a,#b,#c,#d,#e{ 
width:200px; 
height:100px: 
text-aliegn:center: 
hne-height:100px: 
background-color#FFFFO00:) 
#a1margin-left:10px: 
margin-bottom:25px:! 
#b {margin-left:Spx; 
margin-right: 10px; 
margin-top: I lpx; 
float:left 
} 
#c {margin-bottom: 1 Opx;} 
#e{margin-left: 10px; 
margin-top:20px:! 


く /style> 

</head> 

<body> 
<div 1d="all"> 
<div id="a">a 盒子 </div> 
<div id="b">b 盒子 </div> 
<div id="c">c 盒子 </div> 
<div id="d">d 盒子 </div> 
<div id="e">e 盒子 </div> 
</div> 

</body> 

</html> 














为 了 更 方便 地 看 到 div 的 表现 ， 这 里 将 外 部 div 设置 为 枯黄 色 背 景色 ， 并 将 内 部 div 设置 

为 黄 背 景色 。 在 浏览 器 地 址 栏 中 输入 http://localhost/box margin.htm， 浏 览 效果 如 图 2-18 所 

示 。 这 个 实例 非常 典型 ， 特 别 是 b 盒子 、c 信子 和 d 盒子 之 间 的 关系 ， 具 体 关 系 图 如 图 2-19 
所 示 。 








ft Internet Rxploror |， Erogso Internet Explorer 
六 健 全) 則 暗 必 ) 查看 人 区 療 ( ぬ ) 工具 人 靖 動 ⑪⑩ 区 件 せ ) 病 措 ほ ) 查看 0 上 収 応 @) 工員) 吾 助 ⑮ 
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し まり hrsp //1ecwLn リ te_nwrpn im マ 回 9 到 St 这 ME htp://locadhost/bor nargin. hinl I や 加 和 履 按 ” @@ soacrt 国 








图 2-18 外边 距 设 置 图 2-19 外 边 距 关系 图 


由 于 b 盒子 设 置 了 回 左 浮动 ， 所 以 党 随 其 后 的 c 盒子 日 然 移 上 来 ， 和 b 盒子 并 列 在 同一 
行 ， 如 图 2-19 所 示 ，b 盒子 的 高 度 为 : 

heightHmargin-top=111 ( 像 素 ) 

heightHmargin-bottom=110 ( 像 素 ) 

由 此 可 见 ， 在 这 一 行 中 c 盒子 下 面 留 有 1 像 素 的 空隙 , d 盒子 正 是 利用 这 1 像 素 的 空 同 

“法” 上 来 ， 所 以 b 盒子 、c 盒子 和 d 盒子 存在 于 同一 行 上 。 

说 明 : 

当然 ， 读 者 可 以 尝试 把 b 盒子 的 顶部 边 距 设置 为 10 像素 ， 这 时 b 盒子 和 c 金子 高度 一 
致 。 此 时 ，d 盒子 无 法 “ 流 ” 上 来 ，d 盒子 将 自动 换行 ， 位 于 bb 盒子 下 面 。 




















边框 (border) 作为 使 模型 的 组 成 部 分 之 一 ， 其 样式 非常 受 重 视 。 边 框 的 CSS 样式 设 
置 ， 不 但 影响 到 盒子 的 尺寸 ， 还 影 啊 到 盒子 的 外 观 。 边 框 (border) 的 属性 值 有 三 种 ， 边 框 
尺寸 ( 像 系 )、 边 框 类 型 和 边框 闫 色 (十 六 进 制 )。 在 Di\wweb\ 目 录 下 创建 网 页 文件 
(XHTML1.0)， 命 名 为 box_border.htm， 编 瑟 box borderhtm 文件 代码 如 下 : 





<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<title> 边 框 样式 设置 </title> 

<style type="text/css"> 

*{margin:0px;} 

#all{ width:490px: 
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height:400px: 
margin:Opx auto; 
background-color#FF9900:) 


#a,#b,#c,#d,#e,#f,#g{ width:180px: 「 
height:70px: > 
text-align:center; 
line-height:60px; 
background-color#99FFO0:) 

#a1 width:400px: 

margin: 7px; 


border: lpx solid #000000:) 

#b{ border:30px solid #996600: 
float:left;} 

#c{ margin-left:6px; 
border:30px groove #0099FF;t 

#d{ margin-left:6px; 
border:2px dashed #000000: 
float:left:) 

#e{ margn-left:6px: 
border:2px dotted #000000; 
float:left:) 

#f{ margin:6px; 
border-left:2px solid #0000FF: 
border-top:2px solid #0000FF: 
border-right:2px solid #CC3300: 
border-bottom:2px solid # が CC3300: 
float:left; 

#g{ margin-top:6px; 
border-top:2px groove #999999;} 


</style> 
</head> 
<body> 
<div 1d="all"> 
<div id="a">a 盒子 </div> 
<div id="b">b 盒子 (solid 类 型 )</div> 
<div id="c">c 盒子 (groove 类 型 )</div> 
<div id="d">d 盒子 (dashed 类 型 ) </div> 
<div id="e">e 盒子 〈dotted 类 型 ) </div> 
<div id="f'>f 盒子 </div> 
<div id="g">g 盒子 </div> 
</div> 
</body> 
</html> 


为 了 更 方便 地 看 到 div 的 表现 ， 这 里 将 外 部 div 设置 为 本 F9900 背景 色 ， 并 将 内 部 
div 设置 为 #99FF00 背景 色 。 在 浏览 器 地 址 栏 中 输入 http://localhost/box_border.htm， 浏 览 
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效果 如 图 2-20 所 示 。 
汉 边框 辜 式 设置 - Nicrosoft Tnternet Explorer 
立件 ) 编辑 代 ) ”查看 名) 收藏 ty 工具 民 ) ”大助 加 Rs 
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地 址 ⑪) | http Toca1host/boxx border.htm v | 转 到 ”链接 ” 人 SnaeIt 皿 ' 








d 盒 子 【dashed 类 型 ) E 盒 子 【dotted 类 型 ) 


坛子 





2-20 边框 样式 设置 


这 个 实例 使 XHTML 对 象 看 起 来 更 像 是 个 盒子 了 ， 边 框 只 是 盒子 包装 中 的 一 层 ， 最 外 层 
的 包 涛 是 不 可 见 的 外 边 距 。 边 框 的 宫 度 计算 非常 重要 ， 读 者 定位 元 素 要 充分 考虑 边框 宽度 ， 
如 图 2-20 所 示 ， 边 框 的 第 用 设 萤 方法 为 : 

border: 宽 度 类 型 顔色 : 

这 是 4 条 边框 统一 设置 的 方法 ， 如 果 要 分 别 设置 4 条 边框 ， 则 将 border 改 为 border- 
top 《顶部 边框 )、border-bottom (的 部 边框 )、border-left( 左 边框 ) 和 border-right (右边 
框 )。 将 “类型 ”修改 成 不 同样 陈 的 边框 线条 ， 第 用 的 有 solid( 实 线 )、dashed (虚线 )、 
dotted (点 状 线 )、groove (立体 线 )、double〔( 双 线 )、outset( 浮 有 雕 线 ) 等 ， 谈 者 可 以 逐个 


尝试 。 











内 边 距 的 设置 : 





内 辺 距 (padding) 类 似 于 HTML 中 表格 单元 格 的 填充 属性 ， 即 盒子 边框 和 内 容 之 
间 的 距离 。 内 边 距 (padding) 和 外 辺 距 (margin) 很 相似 ， 都 是 不 可 见 的 盒子 的 组 成 部 
分 ， 只 不 过 内 边 距 (padding) 和 外 边 距 (margin) 之 间 夹 着 边框 。 在 D:\web\ 目 录 下 创 
建 网 页 文件 (XHTML 1.0)， 命 名 为 box padding.htm， 编 瑟 box padding.htm 文件 代価 
如 下 : 
<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 


org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
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<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title> 内 边 距 的 设置 </title> 


<style type="text/css"> 
*{ margin:Opx;} ©) 
#all{width:460px; 
height:400px; 
margin:Opx auto; 
padding:30px: 
background-color:#FF9900:) 
#a,#b,#c,#d,#e,#f,#g{width:200px; 
height:80px; 
border: lpx solid #0000FF: 
background-color:#00FFO0;} 
piwidth:100px: 
height:50px: 
paddine-top:20px: 
backgeround-color#CC99CC:! 
#a1padding-left:70px:! 
#b 1padding-top:60px:! 
#c1padding-right:S0px:! 
#d}padding-bottom:40px:! 
</style> 
</head> 
<body> 
<div 1d="all"> 
<div 1d="a"> 
<p>a 盒子 </p> 
</div> 
<div id="b"> 
<p>b 盒子 </p> 
</div> 
<div 1d="c"> 
<p>c 盒子 </p> 


</div> 
<div id="d"> 
<p>d 盒子 </p> 
</div> 

</div> 

</body> 

</html> 








为 了 更 方便 地 看 到 div 的 展现 ， 这 里 将 外 部 div 设置 为 杆 F9900 背景 色 ， 并 将 内 部 div 设 
置 为 #00FF00 背景 色 ， 而 将 p 元 素 设 置 为 #CC99CC 背景 色 。 在 浏览 器 地 址 栏 中 输入 
http://localhost/box padding.htm， 浏 览 效 果 如 图 2-21 所 示 。 
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图 2-21 内 边 距 的 设置 


盒 模型 兼容 问题 


微软 浏览 器 TE 6.0 以 后 的 版 本 ， 内 藤 了 两 种 表现 模式 : 标准 模式 和 鳞 容 模式 。 在 标准 
ee 页 面 以 TE 5.0， 其 至 
IE 4.0 显示 页 面 的 方式 来 显示 ， 使 以 前 的 网 页 也 能 正常 显示 。 这 两 种 模式 最 大 的 问题 束 是 
盒 模式 的 兼容 问题 ， 但 是 ， 正 在 兼容 模式 下 ， RE 天 在 最 新 版 本 的 HE 7.0 中 保 
留 着 ， 一 旦 页 面 使 用 兼容 模式 浏览 ， 了 下 7.0 将 变 成 跟 TE 5.0 一 样 不 兼容 Web 标准 。 

i a ea nn 如 Opera 浏览 器 、FireFox 浏览 

。 使 用 浏览 器 不 同 的 模式 通过 不 同 的 DTD (文档 类 型 声明 ) 来 实现 ， 在 早期 的 HTML 
= HTML 声明 部 分 直接 使 用 如 下 形式 : 


く html>. . <7html> 


芝 欄 的 内面 在 渕 覧 疾 中 渕 覧 時 会 使用 兼 容 模式 , 如果 HTML 页 面 使 用 如 下 DTD 声明 : 


<IDOCTYPE HTML PUBLIC "-//W3C/DTD HTML 4.01//EN" "http:/Awww.w3.0org/ TR/ html4/strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 


a 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
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前 者 代表 HTML 4.0 的 严格 类 型 的 文档 类 型 声明 ， 后 者 代表 XHTML 的 文档 类 型 声明 ， 
这 两 种 DTD 閣 使 洋上 利益 使 用 酸 鶴 模式 。 


说 明 : 


虽然 于 6.0 衝 IE 7.0 浏览 器 对 Web 标准 没有 实现 完全 兼容 ， 但 相对 于 以 前 的 版 本 ， 正 の 


标准 化 程度 提高 了 很 多 。 所 以 读者 制作 标准 页 面 ， 应 使 用 XHTML 的 DTD、 


wi a 
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元 素 的 非常 规定 位 方式 











表面 学 习 了 大 量 的 XHTML 元 系 的 定位 方法 ， 由 于 盒 模型 的 限制 ， 导 致 元 素 无 法 在 页 面 
中 随心 所 欲 进行 摆 放 。 但 是 网 页 内 容 需 要 一 些 能 随意 摆 放 的 元 素 ，CSS 则 提供 了 绝对 定位 模 
式 和 相对 定位 模式 ， 这 两 种 定位 模式 需要 设置 CSS 的 position 属性 。 

position 的 原意 为 位 置 、 安 置 、 状 态 。 在 CSS 布局 中 ，position 属性 非常 重要 ， 很 多 特 
殊 容 器 定位 必须 用 position 完成 。position 属性 有 4 个 值 ， 分 别 是 : static、absolute、 
fixed、relative, 其 中 static 是 默认 值 ， 代 表 无 定位 《一 般 用 于 取消 特殊 定位 的 继承 ， 恢 复 
お AT 人 ) 。 

















“CSS 绝对 定位 


当 容 器 的 position 属性 值 为 absolute 时 ， 这 个 容 絮 即 被 绝对 定位 了 。 绝 对 定位 在 儿 种 定 
位 方法 中 使 用 最 广泛 ， 这 种 方法 能 够 很 精确 地 将 元 素 移动 到 你 想 要 的 位 置 。 使 用 绝对 定位 容 
涡 有 的 前 面 的 或 者 后 面 的 容器 会 认为 这 个 层 并 不 存在 ， 即 这 个 容 右 学 于 其 他 容 右 上 ， 它 是 独立 
出 来 的 ， 类 似 于 Photoshop 软件 中 的 图 层 。 所 以 position 属性 中 的 absolute 用 于 将 一 个 元 素 放 
到 国定 的 位 置 非常 方便 。 

当 多 个 绝对 定位 容器 放 在 同一 个 位 置 时 ， 显 示 哪 个 容 占 的 内 容 呢 ”类似 于 Photoshop 的 
图 层 有 上 下 关系 ， 绝 对 定位 的 容器 也 有 上 下 关系 ， 在 同一 个 位 置 只 显示 最 上 和 耐 的 容器 。 在 计 
算 机 显示 中 把 王 百 于 显示 屏 基 平面 的 方 癌 称 为 z 方 向 , CSS 争 対 定位 的 容器 的 z-index 属性 
对 应 这 个 方向 ，z-index 属性 的 值 越 大 ， 容 右 越 罪 上 。 即 同一 个 位 置 上 的 两 个 绝对 定位 的 容 右 
只 显示 z-index 属性 值 较 大 的 。 
































注意 : 
当 容 器 都 没有 设置 z-index 属性 值 时 ， 默 认 后 面 的 容器 z 值 大 于 前 面 的 绝对 定位 的 


如 果 对 容器 设置 了 绝对 定位 ， 上 默认 情 况 下 ， 容 占 将 紧 挨 看 其 父 容器 对 象 的 左边 和 顶 边 ， 
即 父 容器 对 象 左上 角 。 定 位 的 方法 为 在 CSS 中 设置 容器 的 top (頂部 )、bottom (底部 )、left 
(左边 ) 和 right (右辺 ) 的 值 ， 这 4 个 值 的 参照 对 象 是 浏览 器 的 4 条 边 。 在 D:\web\ 目 录 下 创 
建 网 页 文件 CXHTML 1.0)， 命 名 为 pos ab.htm， 编 写 pos ab.htm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
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org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>CSS 的 绝对 定位 </title> 
<style type="text/css"> 
*{ margin: Opx; 
padding:Opx:) 
#alliheight:500px: 
width:700px: 
margn-left:100px: 
background-color#FFCC99:! 
#box1,#box2,#box3,#box4,#boxS {width:200px; 
height:60px: 
border:Spx double #0000FF; 
position:absolute; + 
#box11 top:10px: 
left:90px: 
background-color#CC9900:) 
#box21 top:20px: 
left:120px: 
background-color# り 9CC00:) 
#box31 bottom:150px: 
left:70px: 
background-color# り 99CC00:) 
#box41 top:10px: 
right:120px: 
z-index:10; 
background-color# り 99CCO00:) 
#box5{ top:20px: 
right:180px: 
Z-Index:9: 
background-color# じ CC9900:) 
#a,#b,#c {width:350px; 
height: 100px; 
border:lpx solid #CC3300; 
background-color:#9966CC:) 
</style><7head> 
<body> 
<div 1d="all"> 
<div id="box1 ウ 第 1 个 固定 的 div 容器 </div> 
<div id="box2 ウ 第 2 个 固定 的 div 容器 </div> 
<div id="box3"> 第 3 个 固定 的 div 容器 </div> 
<div id="box4" ウ > 第 4 條 固定 的 div 容器 </div> 
<div id="box5"> 第 5 个 固定 的 div 容器 </div> 
<div id="a"> 第 1 个 无 定位 的 div 容器 </div> 
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<div id="b"> 第 2 个 无 定位 的 div 容器 <7div> 
<div id="c"> 第 3 个 无 定位 的 div 容器 <7div> 
</div> 
</body> 
</html> 








这 里 将 外 部 div 设置 为 枉 FCC99 背景 色 ， 并 将 内 部 无 定位 的 div， 设 置 为 加 966CC 背 
景色 ， 而 将 绝对 定位 的 div 容器 ， 分 别 设置 为 #CC9900 和 #99CC00 背景 色 ， 并 设置 了 
double 类 型 的 边框 。 在 浏览 器 地 址 柱 中 输入 http://localhost/pos ab.htm， 浏 览 效 果 如 图 2-22 
所 示 。 
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图 2-22 CSS 绝对 定位 





从 本 例 中 可 看 出 ， 设 置 了 top、bottom、left 和 right 其 中 人 至少 一 种 属性 后 ，5 个 绝 
对 定位 的 div 容器 彻底 摆脱 了 其 父 容器 (id 名 称 为 all) 的 束缚 ， 独 立地 漂浮 在 上 面 。 
而 在 未 设置 z-index 属性 值 时 ， 第 2 个 绝对 定位 的 容器 ， 显 示 在 第 1 个 绝对 定位 的 容器 
上 方 ( 即 后 面 的 容器 z-index 属性 值 较 大 )。 相 应 地 ， 第 5 个 绝对 定位 的 容器 虽然 在 第 4 
个 绝对 定位 的 容器 后 面 ， 但 由 于 第 4 个 绝对 定位 的 容器 的 z-index 值 为 10, 第 5 个 绝对 
定位 的 容器 的 z-index 值 为 9， 所 以 第 4 个 绝对 定位 的 容器 ， 显 示 在 第 5 个 绝对 定位 的 
容器 的 上 方 。 

说 明 : 

读者 可 以 随意 拖 动 浏览 器 的 窗口 大 小 ， 观 察 绝对 定位 的 div 容器 的 位 置 变化 。 这 里 还 需 
要 注意 的 是 ， 在 正 6.0 和 IE7.0 中 的 浏览 效果 是 不 一 样 的 。 


2.42 ~ CSS 固 定 定位 


当 容 徐 的 position 属性 值 为 fxed 时 ， 这 个 容 喜 即 补 固定 定位 了 了。 国定 定位 和 绝对 定位 














アゴ Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 








非 党 类似， 不 过 被 定位 的 容器 不 会 随 看 深 动 条 的 拖 动 而 变化 位 置 。 在 视野 中 ， 国 定 定位 的 容 
稚 的 位 連 走 不 会 改変 的 。 在 Diweb\ 目 录 下 创建 网 页 文件 (XHTML1.0)， 命 名 为 
pos fix.htm， 编 写 pos fix.htm 文件 代码 如 下 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>CSS 固定 定位 </title> 
<style type="text/css"> 
* {margin:0px; 
padding:Opx:) 
#all1width:500px: 
height:900px: 
background-color:#FF9900:! 
#fixed1wndth:110px: 
height:90px: 
border:16px outset #993300; 
background-color:#00FFOO: 
position:aDsolute: 
toOD:30DX: 
left:20px:! 
#a1width:250px: 
height:350px: 
margin-left:30px; 
background-color:#0099FF: 
border:2px outset #000;} 
</style></head> 
<body> 
<div 1d="all"> 
<div id="fixed"> 固 定 的 容器 <7div> 
<div id="a"> 无 定位 的 div 容器 </div> 
</div> 
</body> 
</html> 


这 里 将 外 部 div 设置 为 二 F9900 背景 色 ， 并 将 内 部 无 定位 的 div 设置 为 #0099FF 背景 








色 ， 而 将 固定 定位 的 div 容器 设置 为 #00FF00 背景 色 ， 并 设置 了 outset 类 型 的 边框 。 在 浏览 
器 地 址 栏 中 输入 http://localhost/pos fix.htm， 浏 览 效果 如 图 2-23 所 示 。 








读者 可 以 竹 试 拖 动 浏览 如 的 垂下 深 动 条 ， 固 定 容 如 的 位 置 不 会 有 任何 改变 。 不 过 正 6.0 











版 本 的 浏览 右 不 支持 fixed 值 的 position 属性 ， 所 以 网 上 类 似 的 效果 都 是 采用 JavaScript 脚本 


编程 完 





成 的 。 
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图 2-23 CSS 固定 定位 





月 CSS 相对 定位 


当 容 器 的 position 属性 值 为 relative 时 ， 这 个 容 喜 即 被 相对 定位 了 。 相 对 定位 和 其 他 定位 相 
似 ， 也 是 独立 地 浮 在 上 和 面 。 不 过 相对 定位 的 容 融 的 top〔 顶 部 )、bottom (/ 撒 部 )、left (左边 ) 和 





right (右辺 ) 属性 参照 对 象 是 其 父 容 需 的 4 条 边 ， 而 不 是 浏览 需 窗 口 ， 并 且 相 对 定位 的 容 需 浮上 
来 后 ， 其 所 占 的 位 置 仍 然 留 有 空位 ， 后 面 的 无 定位 容器 仍然 不 会 “ 挤 ” 上 来 。 在 Di\web\ 目 录 下 
创建 网 页 文件 (XHTML 1.0)， 命 名 为 pos rel.htm， 编 写 pos_rel.htm 文件 代码 如 下 : 





<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
く head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<style type="text/css"> 
*{ margin: Opx; 
padding:Opx:) 
#all{ width:SO0px; 
height:500px: 
background-color:#FF9900:! 
#fixed1width:130px: 
height:90px: 
border:15px ridge #0000FF: 
background-color:#99FFO0: 
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position:relative; 
top:15px: 
left: 1 Spx;} 
#a ガ b1width:250px: 
height:150px: 
background-color#FFCCFF: 
border:2px outset #000;} 
</style></head> 
<body> 
<div 1d="all"> 
<div id="a"> 第 1 个 无 定位 的 div 容器 </div> 
<div id="fixed"> 相 对 定位 的 容器 </div> 
<div id="b"> 第 2 个 无 定位 的 div 容器 </div> 
</div> 
</body> 
</html> 


这 里 将 外 部 div 设置 为 #FF9900 育 景色 ， 并 将 内 部 无 定位 的 div 设置 为 下 FCCFF 育 景 
色 ， 而 将 相对 定位 的 div 容器 设置 为 #99FF00 背景 色 ， 并 设置 了 inset 类 型 的 边框 。 在 浏览 器 
地 址 栏 中 输入 http://localhost/pos reLhtm， 浏 览 效 果 如 图 2-24 所 示 。 


強 CSS 相 対 定位 二 男 icrosoft Tntermet Explorer 加 回回 
: 文件 ) 编辑 人 让) 查看 ”收藏 让 ) 工具 C) 帮助 加) 和 


Ou OO の 太る 


: 地 址 ⑪) | http://localhost/pos el. © 转 到 
第 1 个 无 定位 的 div 容 姨 








图 2-24 CSS 相对 定位 








相对 定位 的 容 右 其 实 并 未 完全 独立 ， 浮 动 范 围 仍 然 在 父 容 占 内 ， 并 且 其 所 占 的 空 日 位 置 
仍然 有 效 地 存在 于 前 后 两 个 容 融 之 间 。 
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“CSS 程序 简化 


虽然 CSS 文件 或 者 内 入 的 CSS 都 是 纯 文本 文件 ， 但 对 其 进行 整理 和 缩写 ， 对 于 减少 代 人 @) 
人 码 有 很 大 帮助 ， 当 CSS 定义 的 代 但 量 比较 多 时 ， 更 加 突显 整理 及 缩写 的 重要 性 。 
在 本 节 的 内 容 中 ， 我 们 将 介绍 CSS 程序 和 化 的 注意 事项 ， 有 具体 缩写 方法 将 结合 后 面 的 
实例 进行 详细 讲解 。 
加 缩写 属性 
使 用 Dreamweaver 定义 CSS 虽然 很 方便 ， 但 是 程序 生成 的 代码 比较 复杂 ，div 的 CSS 规 
则 定义 的 方 框 属 性 中 定义 的 填充 (padding) 属性 ， 系 统 会 目 动 将 上 下 左右 4 个 属性 分 开 定 
义 ， 而 实际 情况 下 可 以 缩写 在 同一 行内 。 
类 似 的 情况 还 有 : 背景 (background)、 字 体 (font)、 边 框 (border)、 列 表 (list-style )、 
項 充 〈padding)、 边 界 (margin) 等 属性 。 
@ 上 右 下 左 
填充 、 边 框 和 边界 都 有 4 个 边 ， 可 以 合并 成 一 行 ， 授 照 “ 上 右 下 左 ”( 顺 时 针 ) 的 顺序 
定义 ， 中 间 以 空格 来 分 隔 ， 如 “margin:5px 10px 15px 20px;”。 
如 果 “ 上 和 下 ”但 是 “ 左 = 右 ?”， 可 以 简写 成 3 个 值 (上 左右 下 )， 如 “margin:5px 
10px 15px;”， 等 同 于 “margin:5Spx 10px 1Spx 10px;”。 
如 果 “ 上 = 下 ” 且 “ 左 = 右 ” 可 以 人 简写 成 两 个 值 ( 上 下 左右 ), 如 “margin:10px 20px;”， 
等 同 十 “margin:10px 20px 10px 20px:”。 
如果 上 下 左 右 都 相 等 , 就 可 以 合 井 成一 介 舘 , 如 “margin:Spx;”, 等 同 十 “margin:Spx 
Spx Spx Spx; 。 
@ 和佐 号 散 色 
类 似 于 “#00FF00”， 这 样 两 位 重复 的 闫 色 值 ， 可 以 缩写 为 “#0F0”。 
@ 逢 属 性 
有 些 关 于 属性 的 定义 可 以 压缩 到 一 行 中 ， 各 属性 中 间 以 空格 分 隔 ， 如 “font”(〈 字 体 ) 的 
大 小 、 顔 色 和 粗 外 等 。 
頭 利用 通配符 
在 CSS 的 最 开始 部 分 定义 通用 CSS 规则 ， 通 用 规则 对 所 有 的 选择 符号 都 起 作用 ， 这 样 
就 可 以 统一 声明 绝 大 部 分 标签 都 会 涉及 的 属性 ， 比 如 边框 、 边 界 和 项 充 等 。 
用 通 配 符 【*】 送 行 声明 , 如 下 所 示 : 
| 
Margin:0: 
Padding:0; 
} 


此 时 ， 所 有 元 素 的 边界 和 填充 部 为 0。 而 在 其 后 可 以 再 进行 其 他 的 规则 声明 ， 后 面 声明 
的 规则 会 葡 换 反 前 面 的 通 配 属性 定义 。 这 样 是 为 了 避免 一 些 未 声明 的 元 素 ， 因 为 浏览 右 于 认 
样式 而 造成 的 错位 情况 。 
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国 继承 
子 元 素 上 自动 继承 父 元 素 的 属性 值 ， 像 字体 、 闫 色 等 ， 所 以 对 于 可 以 继承 的 CSS 规则 ， 
国 组 合 


某 些 有 相同 属性 的 选择 符 可 以 统一 定义 。 有 相同 属性 的 选择 符 中 间 以 逗号 “, ”分 隔 ， 
如 “body，#main，table{border:0; }”， 等 同 于 分 别 定 义 这 3 个 选择 符 的 边框 为 0。 

到 0px 与 0 

无 论 什 么 单位 ， 都 是 0， 因 此 0px=oin=0px=0。 

在 后 面 的 实例 章节 中 ， 将 以 实例 的 形式 详细 介绍 CSS 缩写 的 方法 。 到 这 里 ， 我 们 已 经 
介绍 了 div+CSS 的 网 页 布局 相关 知识 ， 相 信 读 者 已 经 掌握 div+CSS 大 体 的 布局 方法 ， 以 及 
列表 的 布局 元 素 及 元 素 的 概念 等 ， 在 后 面 的 草 和 中， 我 们 将 学 习 如 何 应 用 div+CSS 制作 静 
态 的 网 页 。 
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用 户 管 理 系 统 是 网 站 建设 中 常见 的 了 鲁 这 画 甸 前 页 产品 衣 曙 三 业 动态 应 用 密 出 。 职 标 我们 于 


一 种 动态 系统 。 用 户 管理 系统 一 役 具 有 ー 
登录 注册 、 资 料 修改 、 找 回 密码 及 注销 FYEyva ”WN 
身份 等 功能 。 本 章 将 创建 一 个 企业 的 国 轩 S CY < 入 
用 户 管理 系统 。 该 实例 中 主要 用 到 了 证 Ry Cle 
创建 数据 库 和 数据 表 、 建 立 数据 源 连 “ 国 ea 
接 、 建 立 记 有 录 集 、 创 建 各 种 样本 页 、 上 ae mA Ea a rm _ 
添加 重复 区 域 显示 多 条 记录 、 页 面 之 ーー 

间 传 递 信息 等 方法 和 技巧 。 和 


Ff 


本 章 的 实例 效果 


1 年 唐 


教学 重点 








MAAATT 


搭建 用 户 管 理 系统 开始 平台 に 
数据 库 的 设计 与 连接 に 

登录 、 注 册 、 修 改 、 找 回 密码 功能 に 
用 户 管 理 系 统 开发 后 的 测试 に 
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愛 凡 搭建 用 户 管理 系统 开发 平台 


用 尸 管 理 系 统 当 用 于 大 型 的 动态 网 站 ， 一 般 部 在 网 站 的 上 页 单独 列 出 一 个 模块 用 于 用 请 











登录 ， 因 此 开发 用 户 管 理 系 统 首 先 要 制作 相关 的 静态 网 页 效果 。 用 户 管理 系统 在 网 站 首页 中 
的 位 置 如 几 3-1 所 示 。 
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3-1 用 户 管理 系统 在 网 站 肯 页 中 的 位 置 


首页 的 布局 在 设计 的 过 程 中 需要 使 用 Photoshop 分 割 图 片 ， 配 置 HS 站 点 浏览 ， 建 立 本 
实例 的 站 点 chap03， 使 用 div+CSS 布局 静态 页 面 。 


う .1.]1 











下 和 面 就 开始 使 用 Photoshop CSS 的 切片 工具 分 割 首页 图 片 。 
首先 ， 在 本 地 计算 机 的 D 盘 建 并 站 点 文件 来 chap03， 在 站 点 文件 夹 中 建立 第 
用 文件 夹 〈 如 css、images、psd)， 如 图 3-2 所 示 。 然 后 从 光盘 里 找到 站 点 chap03/psd 文件 夹 
下 的 index.psd 文件 ， 将 其 复制 到 本 地 站 点 的 psd 文件 夹 中 。 


入 chap03 


: 文件 ) 编辑 于 ) 查看 (收藏 多 ) 工具 (I) 舌 助 ⑪) 
mm の 6 履 の 野 尼 天国 


: 地 址 锯 ) a D: chapn3 




















交 件 和 交 件 夹 在 务 

加 创 娃 一 个 新 文件 夹 
を 記 文 件 基肥 
sy 共享 此 文件 来 


< 新 加 卷 0:) 
加 我 的 文档 
记 共享 文档 
是 我 的 电脑 


WJ 网 上 邻居 








色 3-2 建 并 站 点 文件 来 
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局 动 Photoshop CSS 图 像 处 理 软 件 。 选 择 末 早 栏 中 的 “文件 ”一 “打开 ” 合 
令 ， 打开 首页 index.psd 文件 , 效果 如 岁 うー う 所 示 。 
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图 3-3 首页 可 切片 效果 


开始 分 割 各 部 分 图 片 。 首 先 切割 最 上 面 的 Logo 所 在 行 的 图 片 。 单 击 工具 箱 中 








的 “切片 工具 ”按钮 | 加 ， 从 场景 的 左上 和 角 拉 到 标题 的 右 下 角 ， 如 图 3-4 所 示 。 图 中 虚线 杠 
区 域 就 是 切片 大 小 ， 切 片 后 左上 角 会 显示 一 个 国 国 图 标 。 
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图 3-4 Logo 部 分 的 切片 效果 


接 下 来 分 割 其 他 图 片 部 分 。 保 持 “ 切 片 工 具 ” 按 钮 | 加 为 选中 状态 ， 按 下 
(Ctrl+H》 组 合 键 ， 打 开 辅 助 线 视 网 ， 可 以 先 用 辅助 线 分 割 好 需要 分 割 的 区 域 ， 再 按照 辅助 
线 ， 将 整个 网 页 分 割 成 15 个 小 图 片 ， 如 图 3-5 所 示 。 

导出 网 页 。 到 这 里 ， 切 族 工 作 基 本 完成 。 现 在 ， 要 做 的 就 是 把 它 导 出 为 真正 的 
网 页 。 选 择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 储 为 
Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 236,“ 扩 散 ” 模 式 ,“ 仿 
色 ” 值 为 100%, “Web 靠 色 ” 值 为 100%， 其 他 设置 如 图 3-6 所 示 。 

单 击 “ 储 存 ” 按 钮 ， 打开“ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 选择 “保存 
在 ”后 面 的 下 拉 三 角 按 钮 ”， 选 择 建立 的 chap03 文件 来， 其 他 设置 保持 默认 值 ， 如 图 3-7 
所 示 。 
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图 3-6 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


将 优化 结果 存储 为 
保存 在 ): | 回 chap03 











我 最 近 的 文档 ”| 器 psd 


四 


桌面 














立件 名 名) : index 保存 8) 


保存 美 型 J): HTML 和 図 像 w.htm1) 取消 














设置 : 默认 设置 
切片 : 所 有 切片 























图 3-7 “将 优化 结 采 存储 为 ”对 话 框 设 置 





用 户 管 理 系 统 





单 击 “ 人 保存” 按钮 ， 完 成 保存 切 上 的 操作 。 打 开 保 存 文 件 的 路 径 ， 可 以 看 到 目 
动 生 成 了 一 个 images 的 文件 夹 ， 文 件 夹 中 是 首页 分 割 后 的 小 图 片 ， 设 计时 束 是 通过 调用 这 
些小 图 片 组 成 汉 页 效果 的 ， 如 图 3-8 所 示 。 


篇 iaages | > 


: 文件 ) ”编辑 正 ) 查看 ”收藏 的) 工具 (I) 帮助 出) 各 
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人 联机 订购 照片 

台 打印 图 片 
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四 创建 一 个 新 文件 来 
人 、 将 这 个 文件 夹 发 布 到 
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3-8 ”分割 后 的 小 图 所 


a 配置 用 户 管理 系统 站 点 服务 器 


使用 IS 在 本 地 计算 机 上 构建 用 户 管理 系统 网 站 的 站 点 。 

配置 系统 站 点 服务 器 的 步骤 如 下 : 

首先 启动 IIS, 在 IIS 窗口 中 右键 单 击 “默认 网 站 ”选择 菜单 中 的 “属性 ” 命 
令 ， 打开“ 默认 网 站 属性 ”对 话 框 ， 如 图 3-9 所 示 。 


点 认 网 站 岳 性 (| 
网 站 | ISAFI 季 选 器 | 主 目 录 | 文档 “|‖ 目录 安全 性 | HTTP 头 | 自 定 尽 错误 | 

网 站 标识 
描述 G) : 

IF 地 址 (I): 
TCF 端 口 J): 





























连接 
连接 超时 (WD): 900 | 秒 
四 保持 HTTF 连接 () 











启用 日 志 记 录 旺 ) 


活动 日 志 格 式 ) : 
|W3C 扩展 日 志 交 件 格式 YY | | 尾 性 ).… 














图 3-9 “默认 网 站 属性 ”对 话 框 
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单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 任 ” 文 本 框 中 输入 设置 站 点 文件 夹 路 任 为 
“Di\chap03”， 其 他 设置 保持 默认 值 ， 如 图 3-10 所 示 。 


[请 点 1] 属性 


{ 另 一 台 计 算 机 上 的 共享 名 ) 
) 重 定向 到 URL 


時 で) 


口 脚 本 资源 访问 代 ) 记录 访问 Y】 
1 加 索引 资源 代 ) 
中 写 六 人) 


局 目录 浏览 @@) 
应 用 程序 设置 


应 用 程序 名 画 ): 默认 应 用 程序 册 阶 到 ) 


开始 位 置 : <[ 站 点 #] > 

| 配置 名 .| (な . 
执行 椒 限 下) 
应 用 程序 保护 人 の 


| 王寺 | 应 用 





图 3-10 设置 网 站 的 “本 地 路 径 ” 


EL) 单 击 “文档 ”选项 卡 ， 单 击 对话 框 中 的 “添加 ”按钮 ， 打 开 “ 添 加 默认 文档 ” 
对 话 框 ， 在 “默认 文档 名 ”文本 框 中 输入 index.asp， 如 图 3-11 所 示 。 


默认 网 站 属性 








点 让 也 档 省 三 1 
mg 
に 


色 3-11 设置 首页 的 默认 文档 名 





单 击 “ 和 确定” 按钮， 返回“ 文档” 选项 卡 ， 再 单 击 对 话 框 上 的 “向 上 移动 位 
置 ” 按 钮 国 ， 将 其 移动 到 第 一 位 ， 移 动 后 的 对 话 框 如 图 3-12 所 示 。 
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| 同 站 “| Tsmrr 端 洗 器 | 主 目录 | 文档 | 目录 安全 性 | ITTF 头 | 自 定义 错误 | 


记 ] 自用 文档 页 脚 甸 


| 





图 3-12 设置 浏览 的 优先 位 置 
单 击 “ 人 确定 ”按钮 ， 完 成 “默认 网 站 ”属性 ”的 配置 ， 由 于 前 和 面 已 经 使 用 
Photoshop CS5 对 页 面 进行 了 切片 ， 并 目 动 体 存 生成 了 index.html 页 面 ， 所 以 打开 IE 浏 
览 硕 输入 地 址 : http://127.0.0.1， 即 可 打开 页 和 面 切 片 后 的 效果 。 如 采 可 以 浏览 到 用 
Photoshop CSS 切片 后 的 网 页 效果 ， 说 明 站 点 服务 占 的 配置 已 经 完成 ， 就 可 以 开始 下 一 
个 步骤 的 制作 。 


| 创建 编辑 站 点 chap03 








使用 Dreamweaver CS5 进行 网 页 布局 设计 时 ， 首 先 需 要 用 定义 站 点 问 导 定义 站 点 ， 具 体 


操作 步 缀 如 下 : 

打开 Dreamweaver CS5， 选 择 亲 早 柱 中 的 “站 点 ”一 “省 理 站 点 ”命令 ， 打 开 
“管理 站 点 ”对 话 框 。 

对 话 框 的 左边 是 站 点 列表 框 ， 其 中 显示 了 所 有 已经 定义 的 站 点 。 单 击 右边 的 
“新 建 ” 按 钮 ， 从 弹出 的 下 拉 亲 单 中 选择 “站 点 ”命令 ， 则 打开 “站 点 设置 对 象 ” 对 话 框 ， 
进行 如 下 参数 设置 : 

“站 点 名 称 ”: chap03。 

“本 地 站 点 文件 夹 ” Di\chap03\。 

如 图 3-13 所 示 。 

单 击 列 表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 嚣 名称” chap03。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ” D:chap03\。 

“Web URL”: http://127.0.0.1。 

如 图 3-14 所 示 。 
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头 点 毁 直 对 复 chap03 


Dreamweaver 站 点 是 了 网 站 中 使 用 的 所 有 六 件 和 资源 的 集合 。 Creamweaver 
站 点 通常 包 舍 两 个 部 分 ; 可 在 其 中 存储 和 处 理 艾 件 的 计算 机 上 的 于 地 区 件 
处 丰 可 三 其 中 将 相同 这 件 过 市 到 web 上 的 服务 璐 上 的 远程 信件 淆 。 


您 可 以 在 此 处 省 Dreamweawer 站 点 选择 本 地 如 件 池 和 省 称 。 
站 点 名 称 ; 
本 地 站 点 文件 来 名 


图 3-13 ”定义 站 点 


站 点 设置 对 锡 chap03 





a | 
服务 器 名 称 ; 
和文 
文件 外 
Web Ut: 











3-14 ”设置 “测试 服务 副 ” 参 数 


单 击 “ 保 存 ” 按 钮 ， 则 完成 站 点 的 定义 设置 。 在 Dreamweaver CS5 中 就 已 经 拥 
有 了 刚才 所 设置 的 站 点 了 。 


US div+CSS 布 局 网 页 z 


整体 的 页 面 布局 规划 设计 如 图 3-15 所 示 。 























图 3-15 页 面 整体 布局 设计 


使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 ASP 文档 格式 ， 
将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>// 宣 告 为 ASP 文档 

<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet"' hre 仁 "css/style.css" type="text/css"/>// 链 接 CSS 样式 的 文件 

<title> 用 户 管理 系统 </title> 

</head> 


其 他 div 的 布局 代码 如 下 : 


<body> 
<div id="top "> 
<div id="logo"><img src デ "71mages/7mdex Ol.gif" width="247" height="91" /></div> 
<div 1d="banner"> 
<div id="banner1 "> 
<div class="banner1 "><a href="#"> 首 ”页 </a> <a hre 合 "#> 产 品 介 绍 </a> <a href="# が "> 行 
业 动 态 </a> ”<a hre 人 "如 > 应 用 案例 <a> ”<a hre 伍 "#"> 联 系 我 们 </a></div> 
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</div> 
<div id="banner2"> 
<div class="banner2"><a hre 人 f="#"> 促 销 产 品 </a> <a hre 传 "#f > 产品 目录 </a> <a hre 住 "#"> 上 品牌 日 


录 </a> <a hre 伍 '#'" 人 > 库存 产品 </a> <ahre 仁 咱 "> 解 决 方案 </a> <ahre 仁 "大 > 技 木 要 叙 </a><7div> 


</div> 
</div> 
<div 1d="banner3"> 
</div> 
<div 1d="tu"><1mg src="/images/index 05.gif'></div> 
<div id="deng"><img src="/images/index 06.gif"></div> 
<div 1d="sou"><1img src="/images/index 07.gif"></div> 
<div id="tul "><img src="/images/index 08.g1f"></div> 
</div> 
<div 1d="mid"> 
<div id="xitong"> 
<form method="POST" name="form1" id="form1" > 
<div class="use"> 用 户 : <input name="username" type="text" id="username'" size="10" /> </div> 
<div class="deng"></div> 
<div class="pass'> 蜜 何 : <input name="password" type="text" id="username" size="10" /> 
<input type="submit" name="button" id="button" value=" 登 录 " /> 
</div> 
</form> 
<div class="newuser"><a hre 丘 "Tegister.asp"> 注 其 新 用 </a></div> 
<div class="zhaohui"><a hre 伍 "lostpassword.asp"> 取 回 密 人 码 </a></div> 
</div> 


一 1 


<div id="news"> 


一 1 


<div class="mews"> 











<p> 北 海港 筹划 重大 资产 重组 … [2008-02-30]</p> 
<p> 境 外 银行 入 境 套利 五 路 径 .… [2008-03-21]</p> 
<p> 打 造 跨国 公司 服务 链 … [2008-04-22]</p> 
<p> 某 某 集 团 面 临 重 组 .… [2008-05-01]</p> 
</div> 
</div> 


<div id="product"><img src="/images/index 11.gif" width="460" height="141" /></div> 
<div id="quick"><img src デ "71mages/index 12.gif" width="247" height="154" /></div> 
<div id="mail"><img src="/images/index 13.gif" width="317" height="154" /></div> 
<div 1d="tel"><img src="/images/index 14.gif" width="460" height="154" /></div> 
</div> 

<div 1d="bottom"> <img src="/i1mages/index 15.gif" た た </div> 

</body> 

</html> 





div 布局 完成 后 需要 将 该 页 面 保 存 ， 选 择 亲 单位 上 的 “文件 ”一 “ 男 存 为 ” 命 
令 ， 打开“ 另存 为 ”对 话 框 ， 在 “文件 名 ”文本 框 中 输入 文件 名 为 “index.asp”， 単 市 “ 保 
存 类 型 ”后 面 的 下 拉 三 角 按钮 ， 在 打开 的 下 拉 列 表 框 中 选择 Active Server Pages (*.asp; 
*.asa) 末 单 项 ， 如 图 3-16 所 示 。 单 击 “ 你 存 ” 按 钮 完成 首页 的 布局 设计 。 
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保存 を ①: On 。 9 全国 


css 








加 
桌面 
我 的 文档 
9 
我 的 电脑 
全 
同上 部 居 


文件 名 ): index. asp マ 保存 (8) 


保存 美 型 (T): [hctive Server Fages [*. asp;*. asa] Y | 

















多 3-16 “为 行为 ”对 话 框 设 苇 
在 站 点 中 建立 css 文件 来， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


な 页 面 整 体 CSS*/ 
*{ margin:Opx; 





padding:Opx:! 
body{ width:100%; height: 100%; font-size:12px: background:#000; 


此 设置 页 面 链接 */ 

a:link { 

color: #000000; 
text-decoration: none: 

} 

a:visited { 

text-decoration: none; 
color:#666666: 

) 

a:hoVer { 

text-decoration: underhne: 
color: #FF9900: 

} 

a:active { 

text-decoration: none: 

color: #000000; 

} 

/* 设置 所 有 图 族 的 边框 为 0*/ 
img {border: 0;} 

/* 设置 最 外 层 居 中 显示 ， 实 现 让 整个 页 面 居 中 显示 */ 
#top,#mid,#bottom{ margin:auto; width:1024px;} 
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/* 设置 左 浮 动 的 标签 */ 
#logo,#banner,#banner3,#deng,#sou,#tul,#xitong,#news,#product,#quick,#mail,#tel 
{ float:left;} 
/*top 部 分 */ 
#banner{ 
width:778px; 
width:91px:! 
#bannerl 1 width:545px: 
height:62Dx: 
background-image:url(mages/index 02.gif):) 
.bannerl { width:320px: 
height:21px: 
margin-left:9px; 
margin-top:40px; 
font-size: 18px; font-weight:bold; + 
.bannerl a:link { 
color: #000000; 
text-decoration: none; 
} 
.bannerl a:visited { 
text-decoration: none; 
color:#000; 
) 
.bannerl a:hover { 
text-decoration: underhne: 
color: #FF9900: 
} 
.bannerl a:active { 
text-decoration: none: 
color: が 000000: 
} 
#banner21 width:545px; 
height:29px: 
background-image:url(/1mages/index 04.gif):) 
.banner21 width:400px: 
height:13px: 
margin-left:130px: 
margin-top: 10px;} 
.banner2 a:link { 
color: #000000; 
text-decoration: none: 
} 
.banner2 a:visited { 
text-decoration: none; 
color:#FFF; 
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.banner2 a:hover { 
text-decoration: underhne: 
color: #FF9900; 


) “ 
.banner2 a:active { > 


text-decoration: none; 

color: #000000: 

} 

#banner3{ width:232px; 

height:91px: 

background-image:url(/1mages/index 03.gif);} 

.banner3 { width:150px: 
height:13px: 
margin-left:22px; 
margin-top:40px;} 

/*mid 部 分 

#xitong{ width:247px: 

height:141px: 

background-image:url(/1mages/index 09.gif):) 

.USe1 

margin-left:48px; 

margin-top:6px;} 

.deng{ 

margin-left: 100px; 

) 

.DaSS} 

margin-left:48px; 

margin-top: 1 Opx; 

} 

.newuser} 

margin-left: 140px; 

margin-top: 10px; 

) 

.Zhaohui1 

margin-left:140px: 

margin-top: 10px; 

} 

#news1 width:317px: 

height:141px: 

background-image:url(/1mages/index 10.g1f);} 

.neWS1 

margin-left:20px: 

margin-top:45px; 

line-height: 19px; 

) 


制作 完成 后 在 正 6.0 浏览 器 中 的 显示 效果 如 图 3-17 所 示 。 
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图 3-17 制作 完成 的 首页 效果 
将 首页 的 中 间 部 分 删除 ， 另 存 为 moban.asp 作为 二 级 页 面 备 用 ， 如 图 3-18 所 示 。 
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图 3-18 制作 的 二 级 页 面 效 末 





数据 库 设 计 与 连接 


用 户 管理 系统 要 设计 一 个 存储 用 户 注册 资料 的 数据 库 文件 。 实 例 设计 中 使 用 的 Access 
人 を 次 


数据 库 user 数据 表 如 图 3-19 所 示 ， 在 后 面 的 实例 中 能 够 利用 该 表 实 现 用 户 名 、 答 码 等 资料 




















表記 玉 、 用 管理 系 鐵 





的 添加 。 


en 回 ー 
" 本 机 时 計 配 生 画 牙 二 上 库 工具 
』 





加 后 莹 写 沿 时 用 户 钙 酉 如 可行 站 证 起 呈 和 的 二 
各 。 志和 司 可 查看 有 站 点 过 后 呈 的 得 且 。 











二 计 遇 时。 也 = 人 内 模 幅 。 Fl = 香取 





图 3-19 实例 设计 中 的 user 数据 表 


有朋 数据 库 设计 





| 


用 户 系 统 数据 库 设 计 的 步骤 如 下 : 

创建 数据 库 的 第 一 步 是 根据 要 制作 的 网 站 所 要 面 对 的 访问 者 做 一 个 调 碍 分 析 ， 
了 解 来 访 者 的 情况 。 

根据 第 一 步 的 调 碍 分 机 ， 设 计数 据 表 user 的 字段 结构 ， 如 表 3-1 所 示 。 


表 3-1 user 数据 表 结 构 

意 义 字段 名 称 数据 类 型 字段 大 小 必 填 字段 允许 空 字符 串 索引 

主题 编号 ID 自动 编号 长 整 型 有 无 重复 ) 

用 户 账号 username 文 本 20 是 在 本 

用 户 密码 password 文本 20 是 否 

真实 姓名 truename 文本 20 是 否 六 

用 户 性 别 sex 文本 2 是 否 无 

邮箱 地 址 Email 文本 50 合 是 无 
密码 遗失 提示 问题 Question 文本 50 是 否 无 
密码 提示 问题 答案 Answer 文本 50 是 否 无 

用 户 权 限 Authority 数字 长 整 弄 无 

说 明 : 


数据 库 中 常见 属性 解释 如 下 : 

字段 大 小 : 在 自动 编号 的 字段 大 小 中 常见 的 是 长 整 型 和 同步 复制 ID， 长 整 型 是 Access 項目 中 
的 一 种 4B (32bit ) 数据 类 型 ， 存储 -2 ( 即 -2 147 483 648)~2 1 一 1 ( 即 2147483 647) 之 间 的 数字 。 

必 填 字段 : 是 一 些 用 户 必须 填写 的 字段 ， 在 更 新 数据 库 时 ， 如 果 为 空 将 无 法 更 新 。 
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允许 空 字符 串 : 空 字符 串 ， 首 先 它 是 字符 串 ， 但 是 这 个 字符 串 没 有 内 容 。 空 就 是 null, 


不 是 任何 东西 ， 不 能 等 于 任何 东西 。 
索引 : 索引 是 一 个 单独 的 、 物 理 的 数据 库 结 构 ， 它 是 依赖 于 表 建 立 的 ， 它 提供 了 数据 库 


编排 表 数 据 的 内 部 方法 。 一 个 表 的 存储 是 由 两 部 分 组 成 的 ， 一 部 分 用 来 存放 表 的 数据 页 面 ; 
另 一 部 分 存放 索引 页 面 。 

首先 运行 Microsoft Access 程 序 。 単 市 “空白 数 据 座 ” 披 捉 | 記 , 在 主 界 面 的 右 
侧 打 开 “ 空 白 数 据 库 ”面板 ， 如 图 3-20 所 示 。 单 击 “ 空 白 数 据 库 ”面板 上 的 “浏览 到 某 个 
位 置 来 存放 数据 库 ” 按 钮 医 ， 打 开 “ 文 件 新 建 数据 库 ” 对 话 框 。 











Cs) コ = 
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w 
| |< 
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es FF Microsoft Office Access 
ores offien Online eT 
し に 2 『 ] 
网 lt 1 


鱼 色 职 机 国 图 

















图 3-20 打電 “空白 数 据 麻 ” 面板 





在 “你 存 位 置 ” 后 面 的 下 拉 列 表 框 中 选择 前 面 创建 站 点 chap03 中 的 mdb 文件 
来， 在 “文件 名 ”文本 框 中 输入 文件 名 user， 为 了 让 创建 的 数据 库 能 被 通用 ， 在 “保存 类 


型 ”下 拉 列 表 框 中 选择 “Microsoft Access 数据 库 (2000)” 选 项 ， 如 图 3-21 所 示 。 














保存 位 加 て ): 2 nd 
轩 我 最 ii 文档 | 
车 点 面 

加 我 的 交 档 

本 我 的 电脑 

9 网 上 和 领 拓 


| 文件 名 の : meim 
| 保存 基 型 区 ) [Microsoft Office Access 2000 数据 库 (*.mab) 














图 3-21 “文件 狐 建 数据 库 ” 对 话 框 





户 管 理 系统 





单 击 “确定 ”按钮 ， 人 返回 “ 空 晶 数据库” 面板， 再 单 击 “ 空 日 数据 库 ” 面 板 的 
“创建 ”按钮 ， 即 在 Microsoft Access 中 创建 了 一 个 usermdb 数据 库 文 件 ， 同 时 Microsoft 
Access 目 动 默认 生成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 如 图 3-22 所 示 。 


> 

















色 3-22 创建 的 默认 数据 表 
右键 单 击 “ 表 1: 表 ”， 打 开 快 捷 末 单 ， 执 
行 快捷 采 单 中 的 “设计 视图 ”命令 ， 打 开 “ 男 存 为 ”对 
话 框 ， 在 “ 表 名 称 ” 文 本 框 中 输入 数据 表 名 称 user， 如 
图 3-23 所 示 。 
单 击 “ 确 定 ” 投 钮 ， 系 统 将 目 动 打开 创建 好 
的 user 数据 表 ， 如 图 3-24 所 示 。 











3-23 “为 存 为 ”对 话 框 


/En = 要 工 周 。 user : 吉 滑 曾 IAccess 2002 - 2003 立件 属 式 )- Mi に c= 百 过 
可 
开 培 创建 ”外 部 下 二 类 这 库 I 风 i 座 it 六 
图 播 k 行 ，[ 
短路 行 时 ジジ 
| 后 压 里 区 仁 囊 ”更 5 
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ーーー aa 不 股 志 积 最 扩 可 到 54 全 宰 特 ( 和 括 主 橋 j。 拉 


Fl 情 可 查看 有 站 李 帆 名 称 的 程 助 。 








图 3-24 建立 的 user 数据 表 
按 表 3-1 输入 各 字段 的 名 称 并 设置 其 相应 属性 ， 结 果 如 图 3-25 所 示 。 
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说 明 : 
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Access 为 user 数据 表 自 动 创建 了 一 个 主键 值 ID， 主 键 是 在 所 建 数据 库 中 建立 的 唯一 一 个 真 
实 值 ， 数 据 库 通 过 建立 主键 值 ， 方 便 后 面 搜索 功能 的 调用 ， 但 要 求 所 产生 的 数据 没有 重复 。 
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3-26 ”创建 的 user 数据 表 





为 了 方便 用 己 访问， 可 以 在 数据 库 中 预先 编辑 一 些 记 录 对 象 ， 其 中 admin 用 户 


( 即 为 管理 员 〉 的 权限 ( 即 Authority 字段 ) 值 为 1， 其 余 用 户 权 限 值 为 0, 
如 图 3-27 所 示 。 
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3-27 user 数据 表 中 输入 的 记录 








即 为 一 般 用 户 ， 











第 3 章 





编辑 完成 ， 单 击 “ 保 存 ” 按 钮 图 |， 完 成 数据 库 的 创建 ， 最 后 关闭 Access 
软件 。 





数据 库 连 接 ) ©® 


在 数据 库 创建 完成 后 ， 需 要 在 Dreamweaver 中 建立 数据 源 连 接 对 象 ， 才 能 在 动态 网 页 中 
使 用 这 个 数据 库 文件 。 接 下 来 介绍 在 Dreamweaver 中 用 ODBC 连接 数据 库 的 方法 ， 在 操作 
的 过 程 中 要 注意 ODBC 连接 时 参数 的 设置 。 

说 明 : 

开放 数据 库 互 连 (ODBC ) 是 Microsoft 引用 的 一 种 早期 数据 库 接 口技 术 。Microsoft 引 
用 这 种 技术 的 一 个 主要 原因 是 ， 以 非 语言 专用 的 方法 提供 给 程序 员 一 种 访问 数据 库 内 容 的 简 
单方 法 。 换 名 话说 ,访问 DBF 文件 或 Access Basic 以 得 到 MDB 文件 中 的 数据 时 ， 无 须 懂 得 
Xbase 程序 设计 语言 。 

一 个 完整 的 ODBC 由 下 列 几 个 部 件 组 成 : 

回 应 用 程序 (Application ): 该 程序 位 于 控制 面板 ODBC 内 ， 其 主要 任务 是 管理 安装 
的 ODBC 驱动 程序 和 管理 数据 源 。 

ma 驱动 程序 管理 器 (Driver Manager): 驱动 程序 管理 器 包含 在 ODB DLL 中 ， 对 用 户 
是 透明 的 ， 其 任务 是 管理 ODBC 驱动 程序 ， 是 ODBC 中 最 重要 的 部 件 。 

加 ODBC 驱动 程序 : 是 一 些 DLL, 提供 了 ODBC 和 数据 库 之 间 的 接口 。 

較 数据 源 : 数据 源 包含 了 数据 库 位 置 和 数据 库 类 型 等 信息 ， 实 际 上 是 一 种 数据 连接 的 
抽象 叫 法 。 

基体 连接 步骤 如 下 : 

依次 单 击 “ 欣 制 面 板 ” 一 “管理 工具 ”一 “数据 源 (ODBC)” 一 “系统 
DSN ”命令 ， 打 开 “ODBC 数据 源 管 理 右 ”中 的 “系统 DSN” 选 项 卡 ， 如 图 3-28 所 示 。 


を 0DBC 数据 涯 管理 需 








用 户 DSW 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 (8): 
驱动 程序 添加 ⑪).… | 


La | 
EEC | 


ODEC 系统 数据 源 存 诗 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
统 数 据 温 对 当前 机 器 上 的 所 有 用 情 可见， 包括 WT 服务 。 





图 3-28 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 选 项 卡 


在 图 3-28 中 单 击 “ 添 加 (D)” 投 钮 ， 打 开 “ 创 建新 数据 源 ” 对 话 框 ， 在 “ 创 
建新 数据 源 ” 对 话 杠 中， 选择 Driver do Microsoft Access (*.mdb) 选项 ， 如 图 3-29 所 示 。 





沖 建 新 表 握 必 


i 1™w LT ロニ EE 1 」 
TP Ho FT Fp tk. db で ) 
Driver do Microsoft Excel [本 . wls) 
Driver do Microsoft Faradox [*.db ] 
Driver Far o Microsott Visual FoxFro 
Microsoft hecess Driver [*.mdb) 
Microsoft hecess-Treiber (mdb 
Microsoft dBase Driver 人. dbf) 
Nicrosoft dBase WFF Driver (. dbf) 

を | 





图 3-29 “创建 新 数据 源 ” 对 话 框 


单 击 “完成 ”按钮 ， 打开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 
源 名 (N)” 文 本 框 中 输入 user， 如 图 3-30 所 示 。 


ODBC icrosoft Access 安装 








系统 数据 库 


* 元 尼 ) 
个 数据 库 这 ): 


-一 一 一 这 项 > | 





图 3-30 ” “ODBC Microsoft Access 安装 ”对 话 框 


在 图 3-30 所 示 对 话 框 中 单 击 “ 选 择 (S)” 按 钮 ， 打 开 “ 选 择 数据 库 ” 对 话 
框 ， 单 击 “ 了 驱动 器 (V)” 列 表 框 右 侧 的 下 拉 三 角 按钮 [了 |， 从 下 拉 列 表 框 中 找到 创建 数据 库 
步骤 中 数据 库 所 在 的 盘 符 ， 在 “目录 (D)” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 
夹 ， 然 后 单 击 左上 方 “数据 库 名 (A)” 选 项 组 中 的 数据 库 文 件 user.mdb， 则 数据 库 名 称 自动 
添加 到 “数据 库 名 (A)” 下 的 文本 框 中 ， 如 图 3-31 所 示 。 

















数据 库 名 避 ) 目录 血 ) : 
Ins er. mdb d: chanH3!mdb 


語 liiiGElll 和 ll 驱动 器 0): 


|Access 数据 库 fm 下 | | 国 4: 新吉 巻 "| 





图 3-31 选择 数据 库 











用 戸 管 理系 金 
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找到 数据 库 后 ， 单 击 “ 确 定 ” 按 钮 回 到 “ODBC Microsoft Access 安装 ”对 话 
框 中 ， 再 次 单 击 “确定 ”按钮 ， 将 返回 到 “ODBC 数据 源 管 理 器 ”中 的 “系统 DSN” 选 项 
为 “user”、 了 驱动 程序 为 “Driver do 





卡 ， 可 以 看 到 “系统 数据 源 ” 中 已 经 添加 了 一 个 名 称 
Microsoft Access (*.mdb)” 的 系统 数据 源 ， 如 图 3-32 所 示 。 


を OoDBC 数据 源 管 理 喜 
用 户 DSW 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 


系统 数据 源 (8): 
驱动 程序 添加 Q⑩).… 
ET Driver do Microsoft Access (*.mdb) 
删除 8) 
配置 CC)... | 


0DBC 系统 数 括 温存 诗 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
銃 数 手 送 対 当 前 机 器 上 的 所 有用 呆 可 見 包括 T 服务 。 





图 3-32 添加 系统 数据 源 后 的 “系统 DSN” 选 项 卡 


再 次 单 击 “ 确 定 ” 按 钮 ， 完 成 “ODBC 数据 源 管理 器 ”中 “系统 DSN” 的 





命 人 


设置 。 
局 动 Dreamweaver CS5， 打 开 前 面 制 作 的 index.asp 静态 页 面 。 在 Dreamweaver 
打开 “数据 库 ” 面 板 ， 如 网 3-33 





软件 中 执行 菜单 中 的 “文件 ”一 “窗口 ” 一“ 数据库” 
所 示 。 
单 击 “数据 库 ” 面板 中 的 [ 国 按 钮 ， 弹 出 如 图 3-34 所 示 的 菜单 ， 选 择 “ 数 据 源 


名 称 (DSN)” 选 项 。 


藩 擬 詩 粳 定 i Fe re A 
+ 一 档次 型 : EF VESeript 





GC 





若 要 在 该 页 面 上 司 用 动态 数据 : 

汶 访 站 件 创建 站 点 。 

2. 选择 一 种 立 挡 类型 。 

we 3. 设置 站 点 的 铀 二 服务器。 
4. 电击 上 面 的 + 按钮 创建 连 


に 1 . 


目 定 总 广 按 字 社 审 





者 DSH) 


图 3-33 “数 指 麻 ” 面板 图 3-34 选择 “数据 源 名 称 (DSN) ”选项 
打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 ” 文 本 框 中 输入 connuser, 単 
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击 “ 数 据 源 名 称 (DSN)” 下 拉 列 表 框 右 侧 的 下 拉 三 角 按 铀 着 ， 从 打开 的 数据 源 名 称 (DSN) 下 
拉 列 表 中 选择 user， 其 他 保持 默认 值 ， 如 图 3-35 所 示 。 


数据 源 名 称 (IDSJ) 


连接 名 称 : conmuser 
数据 源 名 称 (DSH): user 
用 戸 名 : 」 
密码 : | 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 SW 
〇 使 用 本 地 DSN 














图 3-35 选择 数据 源 名 称 


在 “数据 源 名 称 CDSN)” 页 面 中 ， 单 击 “ 确 定 ” 按 钮 后 完成 此 步 又。 此 时 在 
“数据 库 ” 面 板 中 的 内 容 应 如 网 3-36 所 示 。 
同时 ， 在 网 站 根 目 录 下 将 日 动 创建 名 为 Connections 的 文件 夹 ， 访 文件 夹 内 有 
一 个 名 为 connuser.asp 的 文件 ， 它 可 以 用 记事 本 打开 ， 内 容 如 图 3-37 所 示 。 
效 梳 库 | 讨 二 和 
十 一 并 档 闪 型 : hsP WEScript で 





CUTITIIHSET 一 记事 本 

文件) 编辑 人 让 ) 格式 Q) 查看 QM 帮助 (0) 

くる へ 
' FileName="Connection odbc_ conn_dsn.htm" 

. Type="ADO" 

' DesigntimeType="'ADO" 

' HTTP="'false"" 

' Catalog="""" 





Dim HH connuser_ STRING 
HM connuser STRING = "dsn=user;" 
る > 





图 3-36 设置 的 数据 库 图 3-37 目 动 生成 的 connuser.asp 文件 


说 明 : 
connuser.asp 文件 中 记载 了 数据 库 的 连接 方法 及 连接 参数 ， 其 各 行 代码 的 含义 如 下 : 
ポ ネ ポポ ポポ ポポ ポポ ポポ ポポ ホ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポポ ポ 
<% 
' FileName="Connection odbc conn dsn.htm" 
' Type="ADO" 
// 关 型 为 ADO 
' DesigntimeType="ADO" 
// 前 三 行 代码 是 设置 数据 库 的 连接 方式 为 ADO 的 连接 方法 





' HTTP="false" 

/设置 http 的 连接 方法 为 否 
' Catalog="" 

/设置 目录 为 空 


' Schema="" 
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/概要 内 容 为 空 

Dim MM user STRING 

/定义 为 user 数据 库 名 的 绑 定 

MM user STRING = "dsn=user;" 

/设置 为 DSN 数据 源 连 接 > 
%> 


ポポ ボネ ポポ ネネ ホネ ネネ ホホ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホホ ネネ ポポ ネネ ホネ ホネ ネネ ホネ ネネ ホホ ネネ ホネ ネネ ホネ ネネ ホネ ネネ ホネ ポポ ホネ ネネ ポポ ネネ 
如 果 网 站 要 上 传 到 远程 服务 器 端 ， 则 需要 对 数据 库 的 路 径 进行 更 改 。 
选择 菜单 栏 上 的 “文件 ”一 “保存 ”命令 ， 则 完成 数据 库 的 连接 。 


登录 功能 


和 
Lo 
ー. a 
ELM 
に re 





























用 户 管理 系统 所 需要 的 页 面 比 较 多 ， 所 以 怖 要 进行 一 个 整体 的 规划 。 在 该 系统 中 ， 除 了 
可 以 让 用 户 输 入 “用 户 名 ”和 “和 密码 ”进行 登录 外 ， 还 应 该 包括 “注册 新 有 用户 ”和 “ 找 回 站 失 
密码 ”的 功能 。 当 用 户 在 “用 户 名 ”文本 框 和 “密码 ”文本 框 中 分 别 输入 用 户 名 和 密码 ， 并 单 
击 “ 登 录 ” 投 钮 后 ， 将 进入 一 个 登录 页 面 ， 该 页 面 应 该 具有 验证 用 户 名 和 密码 是 售 正 确 的 功 
能 。 如 果 用 户 名 和 密码 都 正确 ， 将 直接 进入 用 户 管 理 系统 主页 ; 如 条 不 正确 ， 则 将 显示 不 正确 
信息 ， 并 提示 重新 注册 信息 。 如 采 是 新 用 户 ， 则 可 以 直接 单 击 “ 注 册 痢 用 户 ” 链 接 文 本 ， 进 入 
注册 新 有 用户 页 面 。 如 来 起 记 密 人 码 ， 则 可 以 单 击 “ 取 回 密码 ”文本 链接 ， 进 入 找 回 壮 失 密码 的 页 
面 。 另 外 ， 还 需要 为 用 户 提供 修改 个 人 资料 和 注销 吴 份 的 功能 。 昌 然 ， 这 两 个 功能 没有 在 该 页 
面 上 显示 出 来 ， 但 是 它们 和 注册 信息 都 有 直接 关系 ， 因 此 ， 它 们 也 属于 用 户 管理 系统 乙 中 。 

通过 上 面 的 分 析 与 设计 ， 该 用户 管 理 系 统 主要 由 以 下 一 些 动态 网 页 构成 ， 见 表 3-2: 















































表 3-2 用 尸 数据 设计 表 


需要 制作 的 页 面 页 面 名 称 
用 户 登 录 页 面 index.asp 
登录 成 功 页 面 welcome.asp 
登录 失败 页 面 loginfail.asp 
注册 新 用 户 页 面 register.asp 
注册 成 功 显示 页 面 registerok.asp 
注册 失败 显示 页 面 registerfail.asp 
用 户 找 回 遗 失 密 码 的 页 面 lostpassword.asp 





显示 提示 问题 的 页 面 





正确 回答 问题 后 显示 密码 的 页 面 


修改 个 人 资料 的 页 面 
用 户 删 除 账号 的 页 面 








showquestion.asp 
showpassword.asp 
userupdate.asp 


userdelete.asp 


登录 主页 面 ) 











在 用 户 访问 该 登录 系统 时 ， 首 移 要 进行 吴 份 验证 ， 这 个 功能 是 徘 登 录 页 面 实现 的 。 如 末 
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输入 的 用 户 名 和 密码 与 数据 库 中 己 有 的 用 户 名 和 和 密 人 码 相 逻 配 ， 则 登录 成 功 ， 进 入 到 
welcome.asp 页 面 ; 如 果 输 入 的 用 户 名 和 密码 与 数据 库 中 已 有 的 用 户 名 和 密码 不 匹配 ， 则 登 
录 失 败 ， 进 入 显示 登录 失败 的 页 耐 loginfail.asp。 

制作 步骤 如 下 : 

站 移 来 看 一 下 登录 系统 中 者 包含 哪些 内 容 ， 当 用 户 进 入 站 点 后 ， 看 到 的 是 登录 
系统 的 页 面 index.asp， 3-38 所 示 为 登录 系统 的 主页 面 。 


答 用 户 怎 理 系 续 Nicroroft Internet Esplorer 
XO RU KEO CRU IND HM 
Om 日 -四 四 分 Patmos Ee OAS 
人 者 | tp AI ODN wy 





























产品 介绍 。 行业 动态 ”应 用 案例 联系 我 们 


る な ナタ \ ケ 2 ニョ 


る も A HE St 
N ~ i / AL | し 


开始 于 过 


电疗 公 和 天 ee 产品 推 记 。 局 斯 产 局 


案 田 西 调 视频 间 绍 ms 联系 电话 


er ER トキ アー キー- Te 010-1234567 
5 a Fe, 。 本 
> で を こる  ・ 旧 < ドー ei 
細 百 京 店 圧 陸 生 ”天子 我 们 一 -3m EC | 








图 3-38 ”登录 系统 主页 面 


index.asp 页 面 是 这 个 登录 系统 的 首页 ， 也 是 用 于 输入 登录 信息 的 页 面 。 打 开 刚 创建 
的 index.asp 负面， 输入 网 页 标题 “用 户 管 理 系 统 ”， 选 择 末 单 柱 上 的 “文件 ”一 “保存 ”命令 。 
选择 “用 户 :” 在 “属性 ”面板 的 “文本 域 ” 文 本 框 中 设置 名 称 为 
“username”， 参数 设置 如 图 3-39 所 示 。 
tt 


| 交 本 域 字符 宽度 (Wf) 类 型 ① 単行 G」 〇 ① 多 行員 〇 容 呈 中) 
時 を 条 数 | | 站 中 [| ーー 
| ] 茜 用 品 ) 
[| | 只 志 人) 





图 3-39 ”设置 登录 用 户 名 的 字段 名 称 











选择 “和 密码: ”在 “属性 ”和 面板 的 文本 域 文本 框 中 设置 名 称 为 “password”， 参 
数 设置 如 图 3-40 所 示 。 

为 了 让 没有 注册 的 浏览 者 方便 注册 ， 需 要 输入 “注册 狐 用 户 ” 文 本， 并 将 该 文 
本 设置 为 一 个 切换 到 用 户 注 册页 面 register.asp 的 链接 对 象 ， 以 方便 注册 新 用 户 ， 效 果 如 图 3-41 
所 示 。 








如 果 已 经 注册 的 用 户 态 记 了 密码 ， 
输入 “ 取 回 密码 ”文本 ， 
接 对 象 ， 以 方便 用 户 取 回 窗 全， 如 图 3-42 所 示 。 


区 区 本 域 字符 宽度 中) 类 型 四 单行 @) 〇 多 行 ⑪ の 〇 密 嘆 @ 
最 多 字符 数 | 初始 值 人 多 


|] 禁 用 中 ) 
器] 只 读 鱼 ) 


图 3-40 ”设置 登录 用 户 密码 的 字段 名 称 
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3-41 Y.“ 注 期 新 用 戸 ” 筆 接 
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图 3-42 ” 取 回 密码 设置 


还 希望 以 其 他 方式 能 够 重新 获得 
并 将 该 文本 设置 为 一 个 切换 到 取 回 密码 页 面 lostpassword.asp 的 链 





蜜 価 , 可以 
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表单 编辑 完成 后 ， 下 面 来 编辑 该 网 页 的 动态 内 容 ， 使 用 户 可 以 通过 该 网 页 中 表 
单 的 提交 实现 登录 功能 。 选 择 菜 单 栏 中 的 “窗口 ”一 “服务 器 行为 ”人 命令， 打开“ 服务 器 行 
为 ”面板 。 单 击 该 面板 上 的 “+” 号 按钮 ， 从 打开 的 菜单 中 选择 “用 户 身份 验证 ”一 “登录 








用 户 ” 命 令 ， 如 图 3-43 所 示 ， 向 该 网 页 添加 登录 用 户 的 服务 器 行为 。 
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3-43 添加 “登录 用 户 ， 的 服务 器 行为 





打开 如 图 3-44 所 示 的 “登录 用 户 ” 对 话 框 ， 由 于 该 对 话 框 中 需要 设置 的 参数 


较 多 ， 下 面 将 逐一 回 读 者 进行 介绍 





从 表单 获取 输入 : マ 
用 名手 自 usermane 。 MM 
密码 字段 : passwerd 。。 マツ 

使 用 演 拉 让 无 。。 "| 


一 


用 户 名 列 : 司 


密码 列 : 

















如 果 谷 录 成 功 , 转 到 :| ーー 


し | 转 到 前 一 个 URL( 如 果 它 存在 ) 
如 果 登 录 失 败 ， 转 到 |: | 








基于 以 下 项 限制 访问 : (や 用 户 名 和 密码 
〇 C5 用 户 各、 密码 和 访问 级 别 
获 职 级 别 自 : 











3-44 “登录 用 户 ” 对 话 框 








“登录 用 户 ” 对 话 框 的 第 一 部 分 用 来 设置 表单 中 的 文本 域 的 功能 ， 


下 役 次 : 








@ 从 “从 表单 获取 得 入 ”下 拉 列 表 中 选择 该 服务 器 行为 使 用 网 页 中 的 forml 表单 对 象 中 


浏览 者 填写 的 对 象 。 
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@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 username 对 象 ， 设 定 该 用 户 登 录 服 务 器 行 
为 的 用 户 名 数据 来 源 为 表单 的 username 文 本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 该 用 户 登录 服务 器 行为 
的 用 户 名 数据 来 源 为 表单 的 password 文 本 域 中 浏览 者 输入 的 内 容 。 

“登录 用 户 ” 对 话 框 的 第 二 部 分 是 用 来 设置 服务 器 行为 使 用 到 的 数据 源 连 接 的 一 些 参 数 。 

@ 从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
CONNUSECTo 

@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 器 行为 使 用 到 的 数据 库 表 对 象 为 user。 

@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 user 存 储 用 户 名 的 字段 为 username 字 段 。 

@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 user 存 储 用 户 密码 的 字段 为 password 字 有 段 。 

完成 后 的 设置 如 图 3-45 所 示 。 












































覗 用 赴 接 問 古 : | conmnssr ww 
素 格 | nssr i 
用 尸首 到 : username 
密码 出: | password 


图 3-45 设置 数据 源 连 接 


“登录 用 户 ” 对 话 框 的 第 三 部 分 用 来 设置 用 户 登 录 成 功 或 失败 时 分 别 转 问 的 页 面 。 
@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 问 /welcome.asp 页 面 。 
@ 在 “如 采 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 回 /loginfailasp 页 面 。 
完成 后 的 设置 如 图 3-46 所 示 。 

这 两 个 网 页 将 在 后 面 单独 进行 编辑 。 


加 果 登 录 成 功 ， 转 到 |: /welcome. asp | 训 览 . 























| | 转 到 前 一 个 TEL 如 果 它 存在 ) 
加 颗 登 录 具 贮 ， 转 到 |: laginfail. asp| 训 览 .| 


图 3-46 设置 页 面 转 问 


注意 : 
如 果 选 中 “如 果 登 录 成 功 ， 转 到 ” 栏 下 方 的 “ 转 到 前 一 个 URL( 如 果 它 存在 )” 复 选 框 ， 
则 登录 成 功 后 浏览 器 会 回 到 浏览 index.asp 的 前 一 页 。 


“登录 用 户 ” 对 话 框 的 最 后 一 部 分 是 用 来 设置 后 面 设 定 用 户 浏览 权限 所 要 用 到 的 一 些 参 数 。 

@ 选择 “基于 以 下 项 限制 访问 ”后 面 的 “用 户 名 、 密 但 和 访问 级 别 ” 单 选 按钮 ， 设 定 
后 面 将 根据 用 户 的 用 户 名 、 密 码 及 权限 级 别 共 同 决定 其 浏览 网 页 的 权限 。 然 后 从 
“获取 级 别 自 ” 下 拉 列 表 中 选择 Authority 字 段 ， 表 示 根 据 Authority 字 段 的 数字 来 确定 
用 户 的 权限 级 别 。 

完成 后 的 设置 如 图 3-47 所 示 。 
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如 果 登 录 成 功 , 转 到 : [rwelcoe ay | 

回转 到 前 一 个 URL ( 如 果 它 存在 ) 
如果 堂 未 失敗 ， 转 到 : /loginfail. ssp 
基于 以 下 项 限制 访问 : (つう 用 户 名 和 密码 

⑦ 用 户 名 、 密 码 和 访问 级 别 

获 职 级 别 自 : |Authority v 














图 3-47 设置 访问 权限 
通过 以 上 步 缀 完成 设置 工作 。 设 置 完 成 后 的 “登录 用 户 ” 对 话 框 如 图 3-48 所 示 。 注 意 
対照 栓 査 。 


从 表单 获 职 输入 : forml 


用 户 名 字段 : Username v 


密码 字段 : |Password v| 
使 用 连接 验证 : | connuser 
表格 : | user 
用 户 名 列 : usernane 。。 。 避 
密码 列 : |password v| 
し] 转 到 前 一 个 URL( 如 果 它 存在 ) 
如 果 登 录 失败 , 转 到 : /loginfail.asp | 
基于 以 下 项 限制 访问 : 〇 用户 名 和 密码 
名 用 户 名 、 密 码 和 访问 级 别 
获 职级 别 自 : | Auathority 



























































3-48 ”设置 完成 后 的 “登录 用 户 ” 对 话 框 


设置 完成 后 ， 单 击 “ 确 定 ”按钮 ， 关 闭 该 对 EE 
话 框 ， 返 回 到 “文档 ”窗口 。 在 “服务 器 行为 ”面板 中 增加 守 
了 一 个 “登录 用 户 ” 行 为， 如 图 3-49 所 示 。 

同时 ， 可 以 看 到 表单 对 象 对 应 的 “属性 ”面板 的 
“动作 ”属性 值 为 《<%=MM LoginAction%>， 如 图 3-50 所 示 。 它 
的 作用 天 是 实现 用 户 登 录 功 能 ， 这 是 一 个 Dreamweaver CS5 目 动 
生成 的 动作 对 象 。 

选择 荣 单 栏 上 的 “文件 ”一 “保存 ”命令 ， 
将 该 文档 保存 到 本 地 站 点 中 。 


























3-49 “服务 器 行为 ”面板 





动作 [Ginaaetiag | 问 mW の 
方法 mr MM 编 B| っ 





3-50 ”表单 对 应 的 “属性 ”面板 











用 户 管 理 系 统 








当 用 户 输入 的 登录 信息 不 正确 时 ， 切 换 到 loginfail.asp 页 面 ， 显 示 登 录 失 败 的 信息 。 如 > 
果 浏 览 者 输入 的 登录 信息 正确 ， 将 切换 到 welcome.asp 负面， 如 图 3-51 所 示 。 
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7 全 斌 商务 首 页。 产品 介绍 。 行业 动 杰 ”应 用 案例 。 联系 我 们 
四 -huangOa 


の a 


古 下 让 ”下 发 粳 点 天子 RT 





图 3-51 登录 成 功 界 面 


本 下 将 完善 登录 功能 页 面 ， 制 作 步 又 如 下 : 

将 制作 的 moban.asp 另存 为 loginfailasp 页 面 ， 并 在 网 页 标题 栏 中 输入 “登录 
失败 ”。 

在 文档 中 修改 布局 效果 ， 并 输入 登录 失败 的 说 明文 学 。 在 “文档 ”窗口 中 选中 
“这 里 ”文本 ， 在 其 对 应 的 “属性 ”面板 中 的 “链接 ”文本 框 中 输入 index.asp， 将 其 设置 为 
指向 index.asp 页 面 链接 。 显 示 用 户 登 录 和 失败 信息 的 loginfail.asp 页 面 如 图 3-52 所 示 。 


| DWW | | Wi * fer 
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图 3-52 ”登录 失败 页 面 logimfail.asp 
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选择 荣 单 栏 中 的 “文件 ”一 “保存 ”命令 ， 将 该 文档 保存 ， 完 成 oginfail.asp 








页 面 的 创建 。 

将 制作 的 moban.asp 另存 为 welcome.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “ 登 3 
成 功 ”。 

使用 Dreamweaver CSS 中 提供 的 制作 静态 网 页 的 工具 完成 如 图 3-53 所 示 的 静 
态 部 分 。 为 了 测试 登录 系统 的 方便 ， 在 此 只 编辑 了 一 些 简单 的 内 容 。 
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WP ez 


つの ーー 
る むだ ンー 





















AU PRI MR : iT 
和 六 | HE TT EE 
和 (EWA 7 
} ET E 
03 二 | 王 中 天 有田 マ 
tit : % C100 ぴゃ も 8 
[本 輸 廊 獅 _ | 文 小 | 总 区 | 
oo RA ha の 価 表 
< 很 。 nD es 文件 壹 
1 て の imams 立 位 訂 
た ED sa 文件 再 
面 再 本 。 访 痪 几 后 关于 厦门 到 让 名 ym 广 伸 天 
こ > 人 Man «9 SO AT XR 
Mr Ci el) Civ sews> や) NGG OOY -TU iTF/ 4 MEEK GRIT - 1vowfw) ws IO AT Xi 
IE3 leme uy ke AF XH は 
川 we | E00 BE に 4 es w BA ESM GR 
mc 0 た YY : に | マ ひ の Fw 
CN ] 








* 
| OD  」 TMNT, SR SI (日 ま ) 


图 3-53 ”登录 成 功 欢迎 界面 的 内 容 





选择 荣 单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 面 板 ， 单 击 该 面板 上 
“二 ”号 投 钮 ， 从 打开 的 某 单 中 选择 “阶段 变量 ”命令 ， 为 网 页 中 定义 一 个 阶段 变量 ， 如 图 
3-54 所 示 。 

此 时 将 打开 “阶段 变量 ”对 话 框 。 在 “名 称 ” 文 本 框 中 输入 “阶段 变量 ”的 名 
称 ee 如 图 3-55 所 示 。 











re | 
命令 ( 预存 过 程 ) 


请 求 变量 

应 用 程序 变量 
Spry 数据 集 
获 了 数据 源 . 


2 





图 3-54 ”添加 阶段 变量 图 3-55 ”定义 阶段 变量 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定” 按钮， 关闭 该 对 话 框 ， 返 回 到 “ 文 
档 ” 窗 口 。 在 “ 绑 定 ”和 面板 中 ， 将 显示 一 个 动态 数据 对 象 组 Session。 单 击 Session 图 标 左 边 的 














“+” 号 按钮 ， 可 以 查看 所 有 的 阶段 变量 ， 可 以 看 到 ーー ーー 
刚才 定义 的 MM username 显示 在 其 中 ， 如 图 3-56 十 一 交 档 类 型 SF VEScript 
所 示 。 





在 “文档 ”窗口 中 通过 拖 动 鼠标 选择 
“XXXXXX” 文 本 ， 然 后 在 “ 绑 定 ”面板 中 选择 
MM username 变量 ， 再 单 击 “ 绑 定 ” 面 板 展 部 的 
“插入 ”按钮 插入 ]， 将 其 插入 到 该 “文档 ”窗口 
中 设 定 的 位 置 。 插 入 完毕 ， 可 以 看 到 “XXXXXX” 
文本 被 {Session.MM username} 占 位 符 代 替 ， 如 图 
3-57 所 示 。 这 样 ， 束 完成 了 这 个 显示 登录 用 户 用 户 


| 请 Sessl on 


MM _ sername 




















| 
名 阶段 变量 的 添加 工作 。 当 网 页 在 浏览 器 中 显示 Oo 
时 ， 该 阶段 变量 将 被 具体 的 用 户 名 代 符 。 
DW XH RC) 要 看 WY) 其 和 GD 修 权 全 格式 6) 合 $(C) 交点) 全品) 帮助 00 Eo 
pr ーー 
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3-57” 绑 定 后 的 效果 


前”! 个 本 地 项 目 铁 渤 中 ,总 共 W051 日吉] 


说 明 : 


以 上 定义 的 阶段 变量 对 当前 站 点 内 所 有 的 网 页 文件 都 是 有 效 的 。 用 户 登 录 成 功 时 ， 服 务 

器 就 为 用 户 建 立 一 个 会 话 变量 ， 在 一 般 情 况 下 ， 为 用 户 提 供 的 大 部 分 功能 都 是 基于 这 个 会 话 

对 象 的 ， 如 果 用 户 浏览 完毕 ， 需 要 退出 时 ， 就 必须 结束 这 个 会 话 变量 ; 否则 ， 有 可 能 造成 用 

户 信息 泄露 。 在 一 般 情 况 下 ， 如 果 用 户 关闭 浏览 器 或 用 户 长 时 间 没 有 操作 以 致 服务 器 就 认为 
用 户 已 经 离开 ， 都 可 以 结束 该 用 户 的 会 话 对 象 。 但 是 ， 不 能 通过 这 两 种 消极 的 方式 来 结束 会 
话 ， 应 该 在 网 页 中 为 用 户 提 供 一 个 积极 的 结束 会 话 。 在 Dreamweaver CSS 中 要 实现 这 种 功能 
很 简单 ， 只 要 通过 “注销 用 户 ” 的 服务 器 行为 就 可 以 了 。 





GE 在 “文档 ”窗口 中 通过 拖 动 鼠标 选中 “注销 用 户 ” 文 本 。 打 开 “ 服 务 占 行为 ” 
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面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 菜单 中 选择 “用 户 身 份 验证 ”命令 ， 从 打开 
的 子 羔 单 中 选择 “注销 用 户 ” 命 令 ， 如 图 3-38 所 示 。 


DW 区 第 0 枫 旺 全 ) 于 看 (WI 瑞 ATi 入 大 个 欄 式 人) 命中 ] 站 点 全 ) ” 贸 日 各) 病 還 im 本 ニャ ー | 
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3-58 过 拌 “ 注 铺 用 户 ” 疹 令 


打开 “注销 用 户 ” 对 话 框 。 在 该 对 话 框 中 可 为 所 选中 的 文本 添加 一 个 结束 会 话 
的 服务 占 行 为 ， 其 设置 如 下 : 

@ 在 该 对 话 框 中 的 “在 以 下 情况 下 注销 ” 栏 中 选中 “ 单 击 链接 ” 单 选 按钮 ， 单 击 文本 
框 右 侧 的 下 拉 三 角 按 钮 等 ， 在 打开 的 下 拉 列 表 中 选择 “上 所 选 范围 :“ 注 销 用 户 ” 设置 
结束 会 话 动作 的 触发 事件 是 网 页 中 的 “注销 用 户 ” 文 本 被 单 击 。 

@ 在 “在 完成 后 ， 转 到 ”文本 框 中 输入 /logout.asp， 设 置 结束 会 话 后 ， 转 到 ]ogout.asp 页 
面 。 

完成 后 的 设置 如 图 3-59 所 示 。 























在 以 下 情况 下 注销 : 2 单 击 链接 :| 所 选 范围 : “注销 用 户 “ マ 


( 〇 页 面 载 入 











在 完成 后 ， 转 到 : |/1ogout. asp ] 








3-59 ”设置 完成 后 的 “注销 用 尸 ” 对 话 杠 


设置 完成 后 ， 单 击 “ 和 确定” 按钮， 关闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 在 
“服务 器 行为 ”和 面板 中 增加 了 一 个 “注销 用 户 ” 行 为 ， 如 图 3-60 所 示 。 同時, 可以 看 到 “和希 
束 会 话 ” 文 本 链接 对 应 的 “属性 ”和 面板 中 的 “链接 ”属性 值 为 《<%=MM_ Logout %>， 如 图 3-61 
所 示 。 它 是 Dreamweaver CS5 自 効 生成 的 効 作 対象 。 














用 户 管 理 系 统 


动态 开本 [Session. MM username) 





3-60 “服务 咒 行 为 ”面板 


mm 株 @ x 
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EE 
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回 区 垂直 他 默认 yl 高 | 20 ”标题 中 


3-61 表单 对 应 的 “属性 ”和 面板 











选择 末日 栏 中 的 “文件 ”一 “你 存 ” 命 令 ， 将 该 文档 保存 到 本 地 站 点 中 。 


于 于 登录 功能 测试 


制作 好 一 个 系统 后 需要 进行 测试 才能 上 传 到 服务 占 进 行使 用 。 下 和 面 束 对 登录 功能 进行 测 
Ne 其 步骤 如 下 : 


打开 正 浏 览 器 ， 在 地 址 栏 中 输入 htp:V127.0.0.1， 打 开 index.asp 文件 ， 如 图 3-62 所 示 。 
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3-62 ”打开 制作 的 首页 效果 
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完毕 ， 单 击 





在 网 页 的 表单 对 象 的 文本 框 及 密码 框 中 输入 用 户 名 及 密码 ， 输 入 完 


“登录 ” 按 乌 。 
如果 第 二 歩 } 








真 写 的 登录 信息 是 错误 的 ， 则 浏览 右 融 会 转 到 钳 误 信息 显示 页 面 


loginfailasp， 显 示 登 录 钳 误 信 息 ， 如 疼 3-63 所 示 。 
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用 声 : 
本: 至 和 | 性 录 册 睦 | 请 属相 用 叫 基 而 栓 码 是 百 至 融 
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mi 
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图 3-63 ”登录 失败 页 面 loginfail.asp 的 显示 效果 











如 朱 输 入 的 用 户 名 和 密码 都 正确 《如 输入 表面 数据 库 中 预先 输入 的 admin )， 





则 转 到 welcome.asp 页 面 ， 显 示 登 录 成 功 信息 。 同 时 ， 网 页 中 将 显示 出 登录 用 户 名 ， 如 图 3-64 
所 示 。 这 是 因为 在 网 页 中 设置 了 名 为 MM username 的 阶段 变量 。 


动 哥 好 十 功 ET Intemnet Fails 司 癌 是 
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图 3-64 ”登录 成 功 页 面 welcome.asp 的 显示 效果 








自信 証 、 用 管理 系 徹 





如 果 想 结束 会 话 ， 只 需要 单 击 “ 结 束 会 话 ” 文 本 链接 即 可 。 结 束 会 话 后 ， 
浏览 器 就 会 转 到 页 面 logout.asp〔 该 页 面 需要 事先 设计 静态 的 页 面 效果 )， 向 用 户 显示 出 
结束 会 话 成 功 的 信息 。 这 个 页 面 也 需要 进行 单独 制作 ， 方 法 同 前 面 。 如 果 想 重新 登 
录 ， 只 需要 单 击 “ 这 里 ”文本 链接 ， 就 可 以 转 到 页 面 index.asp， 重 新 登录 ， 如 图 3-65 > 











所 示 。 
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る な 2 きか 1 


严 一 





脖 博 哆 锯 
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图 3-65 ”结束 会 话 成 功 


到 这 一 步 登录 功能 页 面 就 制作 完成 了 ， 读 者 可 以 根据 目 己 设计 的 网 页 内 容 适 当地 增加 和 
修改 关键 子 段 ， 扩 展 用 户 注 册 的 功能 。 


注册 功能 


一 个 用 户 管理 系统 还 需要 有 注册 新 用 户 的 功能 ， 对 于 新 用 户 来 说 ， 通 过 单 击 index.asp 
页 面 上 的 “注册 新 用 户 ” 文 本 链接 ， 进 入 到 名 为 registerasp 的 页 面 ， 输 入 注册 信息 后 单 击 
“注册 ”按钮 ， 即 可 实现 注册 功能 。 


341 


registerasp 负面 用 于 新 用 户 注 册 ， 注 册 狐 用 户 的 操作 实质 上 是 问 usermdb 数据 库 中 的 
user 表 中 添加 记录 的 操作 ， 制 作 完 成 后 的 页 和 面 如 图 3-66 所 示 。 

具体 设计 步骤 如 下 : 

将 制作 的 moban.asp 为 存 为 register.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “用 户 注 册 ”。 

使用 Dreamweaver CSS 中 提供 的 制作 铬 态 网 页 的 工具 完成 如 网 3-67 所 示 的 静 


态 部 分 
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图 3-66 注册 系统 的 主页 面 样式 
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3-67 register.asp 负面 静态 设计 


注意 : 

为 表单 对 象 命 名 时 ， 由 于 表单 对 象 中 的 内 容 将 被 添加 到 user 表 中 ， 因 此 可 以 设置 表单 对 
象 名 定义 与 数据 表 中 相应 字段 名 称 相同 。 例 如 ， TT (ON SE 名 为 
username， 把 用 于 添加 密码 的 文本 框 命名 为 password 等 。 这 样 做 的 目的 是 ， 当 该 表单 中 的 内 
容 被 添加 到 user 表 中 时 它们 会 自动 配对 ， 即 将 文本 “确认 密码 ”对 应 的 文本 框 命名 为 


passwordl 。 


需要 设置 一 个 验证 表单 的 动作 ， 用 来 检验 浏览 者 在 表单 中 填写 的 内 容 是 售 满 足 
数据 库 中 表 user 中 学 段 的 要 求 。 这 样 ， 在 将 用 户 十 写 的 注册 资料 提交 到 服务 右 之 前 ， 束 会 对 
用 户 填 写 的 资料 进行 验证 。 对 于 不 符合 要 求 的 信息 ， 可 以 同 浏 览 者 显示 错误 的 原因 ， 并 让 浏 
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第 3 草 








史 者 备 狐 输入 。 首 先 选择 制作 页 面 中 的 整个 表单 ， 然 后 选择 亲 蛙 位 中 的 “窗口 ”一 “行为 ” 
命令 ， 打 开 “ 行 为 ”面板 。 单 击 “ 行 为 ”面板 中 的 “+” 按 钮 ， 从 打开 的 “行为 ”列表 中 选 
择 “ 检 查 表 单 ” 命 令 ， 将 打开 “检查 表单 ”对 话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 
@ 议 置 username 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 的 ”;“ 可 接受 ” 选 “ 任 何 东 西 ”， 
即 该 文本 域 必 须 填 写 ， 不 能 为 至 。 
@ 议 置 tuename 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 的 ”“ 可 接受 ” 选 “ 任 何 东 西 ”， 
即 访 文本 域 必 须 填 写 ， 不 能 为 至 。 
@ 设置 password 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 和 需 的 ”;“ 可 接受 ” 选 “ 任 何 东 西 ”， 
即 访 文本 域 必 须 填 写 ， 不 能 为 至 。 
@ 设置 passwordl1 文本 域 的 验证 条 件 “ 值 ”为 :“ 必 和 需 的 ” “可 接受 ” 选 “ 任 何 东 西 ”， 
即 该 文本 域 必 须 填 写 ， 不 能 为 至 。 
设置 email 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 ” 的 ;“ 可 接受 ” 选 “ 电 子 信件 地 址 ”。 
@ 设置 question 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 需 的 汪 “ 可 接受 ” 选 “ 任 何 东 西 ” 即 
该 文本 域 必 须 填 写 ， 不 能 为 空 。 
@ 设置 answer 文 本 域 的 验证 条 件 “ 值 ”为 :“ 必 和 需 的 ” “可 接受 ” 选 “ 任 何 东西 ”有 即 
该 文本 域 必 须 填 写 ， 不 能 为 空 。 
该 动作 完成 后 的 设置 如 图 3-68 所 示 。 





























可 接受 : 〇 ”任何 东西 〇 数字 
@@ 电子 邮件 地 址 ”CC) 数字 从 





图 3-68 设置 “检查 表单 ”动作 





设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 返 回 到 “文档 ”窗口 。 在 对 应 的 “标签 检查 
器 ”面板 中 设置 “行为 ”动作 的 触发 事件 为 onSubmit， 表 示 按 下 “提交 ”按钮 则 进行 检测 ， 设 
置 完 成 后 如 图 3-69 所 示 。 








| 属性 | 行为 | 标签 <formy 
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图 3-69 设置 “行为 ”动作 
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说 明 : 

在 该 网 页 中 可 以 看 到 设置 了 两 个 填写 密码 的 文本 域 ， 这 样 做 的 目的 是 让 用 户 连 续 两 次 输 
入 密码 内 容 ， 如 果 两 次 密码 一 致 ， 服 务 器 则 接 党 密码。 这样 可 以 避免 用 户 在 输入 密码 时 由 于 
按 错 键 造 成 密码 丢失 。 但 是 ，Dreamweaver CS5 的 验证 表单 动作 没有 提供 检查 密码 一 致 性 的 
功能 ， 还 需要 在 源 代 码 中 加 入 一 段 简单 的 程序 来 实现 这 种 功能 。 


在 “文档 ”窗口 中 单 击 工具 栏 上 的 代码 按钮 贸 病 ， 切换 到 代码 编辑 窗口 ， 然 
后 在 验证 表单 动作 的 源 代码 中 加 入 如 下 代码 : 

if (MM findObj('password').value!=MM findObi(password19.value) errors += '- 两 次 密码 输 
和信 不一致 mr 

修改 后 该 动作 的 源 代 码 如 下 : 





<script type デ "tex1JavaScript "> 

ご !-- 

function MM findObi(n, d) 1 //v4.01 
var p,Lx; 1f(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { 

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} 

if(!(x=d[n])&&d.all) x=d.allln]; for (=0; Ix&&i<d.forms.length;i++) x=d.forms[1 [nj; 
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM findObj(n,d.layers[il.document); 
if(!x && d.getBlementByld) x=d.getElementByld(n); return x: 

} 


function MM validateForm() ! //v4.0 
var 1,p,q,nm,test,num,min,max,errors=",args=MM validateForm.arguments: 
for (1=0; 1<(args.length-2); 1+=3) { test=args[1+2]; val=MM findObj(args[1]); 
if (val) { nm=val.name; if ((val=val.value)!="") { 
if (test.indexOf('1sEmail")!=-1) { p=val.indexOf('(®'); 
if (p<1 | p==(val.length-1)) errors+=- +nm+ .\n'; 
} else if (test!='R') { num = parseFloat(val); 
if (isNaN(val)) errors+='- +nm+' must contain a number. \n'; 
if (test.indexOf('inRange') != -1) { p=test.indexOf(:"; 
min=test.substring(8,p); max 三 test.substring(D 十 1 ): 
if (num<min || max<num) errors+=- '+nm+' must contain a number between '+min+' and 
‘+maxt+'.\n'; 
} } } else if (test.charAt(0) = 'R') errors +='-'Hnm+'" 需要 输入 .\n'; } 
} 
if (MM findObj('password').value!=MM findObj('password1').value) errors += -两 次 密码 输入 不 一 
致 mi: 
if (errors) alert( 注 册 时 出 现 如 下 错误 :n+errors); 
document.MM return Value = (errors == "); 
} 
//--> 
</script> 


编辑 代码 完成 后 ， 单 击 工具 栏 上 的 设计 按 钢 | 国 说 +{|， 返 回 到 “文档 ”窗口 。 
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此 时 ， 可 以 训 试 一 下 执行 的 效 末 。 两 次 输入 不 同 的 密 人 但， 然后 单 击 “ 确 认 ” 按 钮 ， 捉 区 
表单 中 填写 的 内 容 。 此 时 ， 将 打开 一 个 如 疼 3-70 所 示 的 警告 椎 。 


Microsoft Internet Explorer 区 | © 


] 填 与 出 现 如 下 的 错 
1 | ー username 
- password 种 轨 输入. 
ー passwordl EN 


ー truename 布 去 输 
- email 需 雯 轴 上. 
- answer 需 去 输 上 六. 





图 3-70 “提示 错误 


接 下 来 应 该 在 数据 库 中 添加 一 条 用 户 记 录 ， 把 这 些 合格 的 数据 添加 到 这 条 记录 
的 相应 学 段 中 去 。 这 束 害 要 在 该 网 页 中 洪 加 一 个 “插入 记录 ”的 服务 器 行为 。 打 开 “ 服 务 器 
行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 六 早 中 选择 “插入 记录 ”命令 打开 
“插入 记录 ”对 话 框 。 

在 该 对 话 框 中 进行 如 下 设置 : 

@ 从 “连接 ”下 拉 列 表 中 选择 connuser 作 为 数据 源 连 接 对 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 user 作 为 使 用 的 数据 库 表 对 象 。 

@ 在 “搬入 后 ， 转 到 ”文本 框 中 设置 记录 成 功 谍 加 到 表 user 后 ， 切 换 到 megok.asp 网 



































页 。 
@ 该 对 话 框 的 下 半 部 分 用 于 将 网 页 中 的 表单 对 象 和 数据 库 中 表 user 中 的 字段 一 一 对 应 起 
来 。 


设置 完成 后 该 对 话 框 如 图 3-71 所 示 。 











连接 : 2DIIrLSeL 本 
质 入 到 表格 :user -| 
插入 后 ， 转 到 : |/regok. asp | 
获取 值 自 : | form | 旺 提 变 时 ) 
表单 元 素 : | RE 人 人 时 | 到 | 中 sername” 
Co 1 
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列 : nsername 
提 变 汐 : | 文本 


























图 3-71 设置 完成 后 的 “插入 记录 ”对 话 杠 
设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 
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用 户 名 在 数据 库 表 中 的 关键 字 也 是 用 户 登 录 的 身份 标 六 ， 是 不 能 重复 的 。 所 以 
在 添加 记录 之 前 ， 一 定 要 先 在 数据 库 中 得 找 该 用 户 名 是 人 否 存 在 ， 如 果 存 在 ， 则 不 能 进行 注 
册 。 在 Dreamweaver CSS 中 已 经 提 供 了 一 个 检查 新 用 户 名 的 服务 右 行 为 用 于 实现 该 操作 。 单 
击 “ 服 务 器 行为 ”面板 中 的 “+” 号 按钮 ， 从 打开 的 采 单 中 选择 “用 户 和 映 份 验证 ”一 “ 检 
查 新 用 户 名 ”命令 ， 如 图 3-72 所 示 ， 同 该 网 页 添加 检查 狐 用 户 名 的 服务 此 行为 。 
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图 3-72 添加 “ 栓 信 新 用 戸 名 ” 的 服 径 笑 行 訪 


此 时 ， 将 打开 一 个 “检查 新 用 户 名 ”对 话 框 ， 在 该 对 话 框 中 进行 如 下 设置 : 

@ 在 “用 户 名 字段 ”下 拉 列 表 中 选择 username 字 段 。 

@ 在 “如 果 已 存在 ， 则 转 到 ”文本 框 中 输入 /regfail.asp。 表 示 如 果 用 户 名 已 经 存在 ， 则 
切换 到 regfail.asp 页 面 ， 显 示 注 册 失 败 信 息 。 该 网 页 将 在 后 面 进行 编辑 。 

设置 完成 后 的 对 话 框 如 图 3-73 所 示 。 














用 户 名 字段 | 


如 果 已 存在 ， 则 转 到 : |/Yegfail. asp 








图 3-73 “ 检 碍 新 用 户 名 ”对 话 框 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 ， 返 回 到 
“文档 ”窗口 。 可 以 看 到 ， 在 “服务 占 行 为 ”和 面板 中 增加 了 一 个 “检查 新 用 户 名 ”行为 ， 
如 图 3-74 所 示 。 

选择 菜单 栏 中 的 “文件 ”一 “保存 ”命令 ， 将 该 文档 保存 到 本 地 站 点 中 ， 完 成 
本 页 的 制作 。 























昌行 


十 一 可 档 关 型 : hsP WEScript 


检查 新 用 户 书 
插入 记录 FOEM "Earm1"] 





3-74 增加 “检查 新 用 户 名 ”行为 








为 了 方便 浏览 者 进行 登录 ， 应 该 在 regok.asp 页 面 中 设置 一 个 切换 到 index.asp 页 面 的 链 
接 对 象 ， 以 方便 用 户 进行 登录 。 同 时 ， 为 了 方便 浏览 者 重新 进行 注册 ， 应 该 在 regfail.asp 页 
面 中 设置 一 个 切换 到 register.asp 页 面 的 链接 对 象 ， 以 方便 用 户 进行 重新 注册 。 

将 制作 的 moban.asp 另存 为 regok.asp 页 面 ， 使 用 Dreamweaver CSS Nk 
制作 静态 网 页 的 工具 完成 如 图 3-75 所 示 的 静态 部 分 。 制作 比较 人 简单， 这 里 不 再 袭 述 。 其 中 
“这 里 ”文本 设置 为 指 问 index.asp 页 面 的 链接 。 


DW 文件 0) 商人 殿 (0) 春香) 遇 入口 ) 棚 記 人 W) 格式 0O) 会 を て) 站 点 好 ) 倒 口 rj 新生 00 | 深重 < 
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图 3-75 注册 成 功 regok.asp 页 面 
如 果 用 户 输 入 的 注册 信息 不 正确 或 用 户 名 已 经 存在 ， 则 应 该 同 用 户 显 示 注 册 失 


败 的 信息 。 这 里 再 新 建 一 个 regfail.asp 页 面 ， 访 页 面 的 设计 如 图 3-76 所 示 。 其 中 “这 里 ” 文 
本 设置 为 指 问 register.asp 负面 的 链接 。 











编辑 工作 完成 后 ， 束 可 以 测试 该 注册 页 面 的 执行 情况 了 。 
打开 正 浏览 器 ， 在 地 址 栏 中 输入 http://127.0.0.1/registerasp， 打 开 registerasp 文 


件 ， 如 图 3-77 所 示 。 
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3-77 打开 的 测试 页 面 


在 此 可 以 在 该 注册 页 面 中 故意 输入 一 些 不 正确 的 信息 ， 如 漏 填 一 些 username、 
password 等 必 填 字段 ， 或 填写 非法 的 E-mail 地 址 ， 或 在 确认 密码 时 两 次 输入 的 密码 不 一 致 ， 
以 测试 网 页 中 验证 表单 动作 的 执行 情况 。 如 果 填 写 的 信息 不 正确 ， 则 浏览 器 应 该 打开 警告 
框 ， 癌 浏览 者 显示 错误 原因 ， 如 图 3-78 所 示 。 

在 该 注册 页 面 中 注册 一 个 已 经 存在 的 用 户 名 ， 如 输入 “admin”， 用 来 测试 检测 
新 用 户 服 务 器 行为 的 执行 情况 。 然 后 单 击 “ 确 定 ” 按 钮 ， 此 时 由 于 用 户 名 已 经 存在 ， 浏 览 器 
应 目 动 切换 到 regfail.asp 页 面 ， 如 图 3-79 所 示 ， 提 未 浏览 者 该 用 尸 名 已 经 存在 。 此 时 ， 浏 览 
者 可 以 单 击 “这 里 ”文本 链接 ， 返 回 register.asp 页 面 ， 以 便 重 新 进行 注册 。 

在 该 注册 页 面 中 填写 如 图 3-80 所 示 的 正确 注册 信息 ， 然 后 单 击 “确定 ”按钮 。 
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由 于 这 些 注 册 资 料 完 全 正确 且 这 个 用 户 名 没有 重复 。 浏 览 需 应 切换 到 regok.asp 
页 面 ， 向 浏览 者 显示 注册 成 功 的 信息 ， 如 图 3-81 所 示 。 此 时 ， 浏 览 者 可 以 单 击 “这 里 ” 文 
本 链接 ， 切 换 到 index.asp 页 面 ， 以 便 进 行 登 录 。 


马 册 疡 管理 穆 凡 Nineoaoltt Iniernet Eplerer 
Ed 











Gu ©O MOG Pr mn OGD E- 
EM OY i Tt 1Jmegrik ss 


20 全 同上 : 


昔 于 到。 到 已 是 订单 证 IE 
上 上 上 :PE 上， 








图 3-81 注册 成 功 页 面 显示 
ED 可 以 在 Access 中 打开 用 户 数 据 库 文 件 usermdb， 查 看 其 中 的 user 表 対 象 的 内 
容 。 此 时 可 以 看 到 ， 在 该 表 的 最 后 ， 增 加 了 一 条 新 记录 ， 如 图 3-82 所 示 。 这 条 数据 束 是 刚 
才 在 网 页 register.asp 中 提交 的 注册 用 户 的 信息 。 











i 


passy ~ truEnz ~ ~ Email Questiomn 全 
admim admin desigmemQ153. con 网 站 的 管理 者 是 让 
666666 刘 飞 1iufei@263.com ”你 的 宠物 叫 什 么 ? 
123456 张 授 朝 Yuangchao@sina. c 你 最 喜欢 什么 ? 


12 12 testQ163. com 你 是 谁 ? 归 
[记录 M < 筐 4 項 ( 共 4 項 とり || 素 | 捜 雪 | 4 に に = » 


图 3-82” 表 user 中 添加 了 一 条 新 记录 
这 个 实例 是 用 户 管理 系统 的 注册 功能 页 面 的 制作 和 测试 。 通 过 本 节 内 容 的 学 习 ， 谈 者 已 














经 可 以 独立 完成 网 站 的 注册 系统 ， 并 将 其 应 用 到 复杂 的 网 站 系统 中 。 
> 多 球 ゝ 人 已 
资料 修改 与 删除 功能 
一 般 情 况 下 ， 用 户 管 理 系 统 都 应 该 为 用 户 提 供 修 改 注册 资料 的 功能 ， 访 功能 应 包括 用 户 


资料 修改 及 删除 用 户 的 操作 。 实 际 上 ， 人 和 修改 注册 用 户 的 过 程 惑 是 更 新 记录 的 过 程 。 本 节 将 介 
绍 如 何 实现 用 户 资 料 的 修改 及 删除 功能 。 


9 资料 修改 页 面 : 


该 幢 面 主要 是 把 用 户 所 有 资料 疼 了 9 出， 通过 更 新 记录 有 的 命令 实现 制作 。 具 体 的 制作 步 又 如 下 : 























用 户 管 理 系 统 





将 制作 的 moban.asp 另存 为 userupdate.asp 页 面 ， 使 用 Dreamweaver CSS 中 提 
供 的 制作 静态 网 页 的 工具 完成 如 网 3-83 所 示 的 静 恋 部 分 。 
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3-83 userupdate.asp 静态 页 面 
打开 “ 绑 定 ”和 面板 ， 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 末 单 中 选择 “ 记 


录 集 (会 询 )” 命 分 ， 打 开 “ 记 录 集 ”对 话 框 。 
在 该 对 话 杠 中 进行 如 下 设置 

















@ 在 “名 称 ” 文 本 框 中 输入 Recordsetl 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connuser 数 据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 user。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 在 “ 炳 选 ” 栏 中 设置 记录 集 过 滤 的 条 件 为 username: =: 阶段 变量 : MM UserName。 


完成 后 的 设置 如 图 3-84 所 示 。 
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图 3-84 定义 记录 集 
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设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 。 返 回 到 “ 文 
档 ” 窗口， 此 时 “ 绑 定 ”面板 中 就 绑 定 了 一 个 Recordsetl 记录 集 ， 如 图 3-8 所 示 。 

然后 将 Recordsetl 记录 集中 的 字段 绑 定 到 页 面 上 相应 的 位 置 。 对 于 网 页 中 的 单 
选 按钮 组 sex 对 象 ， 绑 定 动态 数据 可 以 按照 如 下 方法 ， 单 击 “ 服 务 器 行为 ”面板 中 的 “十 ” 
号 投 钮 ， 从 打开 的 染 单 中 选择 “动态 表单 对 象 ” 一 “动态 单 选 按钮 ”命令 ， 打 开 “ 动 态 单 选 
投 钮 ”对 话 框 。 设 置 动 态 单 选 按钮 组 对 象 。 从 动态 “ 单 选 按钮 组 ”下 拉 列 表 中 选择 forml 表 
单 中 的 单 选 按钮 组 sex。 单 击 “ 选 取 值 等 于 ”文本 框 右面 的 到 按钮 ， 从 打开 的 动态 数据 列表 
框 中 选择 记录 集 Recordset1 中 的 sex 字段 ， 设 置 完成 后 对 话 框 如 图 3-86 所 示 。 

we ts = 


も 一 净 档 类 型 : ASP VBScript G 

















改定 
一 了 记录 集 (Recordset1) 
ID 


username 
password 
truename 
sex 
Email 


Question 





hnswer 
Authority 
[第 一 个 记录 ... 
[最 后 一 个 记 ... 
[总 记录 数 ] 








值 : 男 
选 职 值 等 于 : <%= (Recordsetl. Fields.Item("sex" i 























3-85 绑 定 的 记录 集 图 3-86 设置 动态 单 选 按 钮 





用 鼠标 将 数据 绑 定 到 页 面 上 相应 的 位 置 后 ， 页 面 的 显示 如 图 3-87 所 示 。 
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: | <%= (Recordsetl1.Fields. 1 
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污 子 邮件 : | <%= (Recordset1.Fie1ds. 1 

密码 提示 问题 : | <%= (Recordset 1.Fields. 1 
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单 击 “服务 右 行 为 ”面板 中 的 “+” 号 按钮 ， 从 打开 的 染 单 中 选择 “更 新 记录 
集 ” 命 令 ， 为 网 页 添加 更 独 记 录 的 服务 右 行 为 。 打 开 “ 更 新 记录 ”对 话 框 。 该 对 话 框 与 插入 
记录 对 话 框 十 分 相似 ， 具 体 的 设置 悄 况 如 图 3-88 所 示 ， 这 里 不 再 资 述 。 








尝 按 ~ 
要 更 新 的 表格 : user wv 
选 职 记录 自 : Rscordss wv 


唯一 键 列 : Tn マッ | | 数值 
在 更 新 后 ， 转 到 :Auaserupdateok. asp 训 览 ... 


获 职 值 自 : | for Y | (在 提 变 时 ) 
表单 元 来 : EE 


sex 更 新 列 | ”sex” 
Fmsi1 更新 列 "Emsi1" 


到 | : username 


提 蛮 为 : 立 本 





图 3-88 “更 新 记录 ”对 话 框 


设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 选 择 
菜单 栏 中 的 “文件 ”一 “保存 ” 命 令 ， 将 该 文档 保存 到 本 地 站 氮 中 。 


注意 : 

由 于 本 页 的 MM username 值 是 来 自 上 一 页 注册 成 功 后 的 用 户 名 值 ， 所 以 单独 测试 将 提 
示 出 错 信息 ， 需 要 先 登 录 后 ， 在 登录 成 功 页 面 中 单 击 “ 修 改 个 人 资料 ”链接 到 该 页 面 才 会 产生 
效果 ， 这 在 后 面 的 测试 实例 中 将 进行 详细 介绍 。 


虽 333 完善 修改 功能 ) 


用 户 修改 注册 资料 成 功 后 ， 应 切换 到 userupdateok.asp 页 面 。 在 该 网 页 中 ， 应 该 癌 用 户 
显示 资料 修改 成 功 的 信息 。 同 时 ， 如 果 用 户 想 继续 修改 资料 ， 则 应 该 为 用 户 提 供 一 个 返回 到 
userupdate.asp 页 面 的 文本 链接 。 如 果 用 户 不 需要 修改 ， 则 应 该 为 用 户 提 供 一 个 切换 到 
welcome.asp 页 面 的 文本 链接 。 为 了 同 用 户 提 供 更 加 友好 的 界面 ， 应 该 在 网 页 中 显示 用 户 修 
改 的 结束 ， 以 提示 用 户 检 得 修改 是 人 否 正 硝 。 

具体 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 userupdateok.asp 页 面 ， 使 用 Dreamweaver CSS 中 
提供 的 制作 毅 态 网 页 的 工具 完成 如 图 3-89 所 示 的 表态 部 分 。 

为 了 回 用 户 提 供 更 加 友好 的 界面 ， 应 该 在 网 页 中 显示 用 户 修 改 的 结 采 ， 以 提示 
用 户 检 答 修改 是 否 正 确 。 为 了 实现 该 目的 ， 首 先 应 该 定义 一 个 记录 集 ， 其 方法 与 制作 
userupdate.asp 页 面 中 定义 记录 集 的 方法 一 样 。 然 后 请 加 记录 集中 的 动态 数据 对 象 ， 把 用 户 修 
改 后 的 信息 显示 在 空白 负面 中 ， 如 图 3-90 所 示 。 
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页 面 ， 这 个 页 面 用 于 实现 删除 用 户 功能 ， 





供 的 制作 藤 态 网 页 的 工具 完成 如 图 3-91 所 示 的 静态 部 分 。 





具体 制作 步骤 如 下 : 
将 制作 的 moban.asp 另存 为 useredelete.asp 页 面 ， 使 用 Dreamweaver CSS 中 提 
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打开 welcome.asp 页 面 ， 首 先 在 welcome.asp 页 面 中 增加 一 个 切换 到 用 户 记录 
删除 页 面 useredelete.asp 的 链接 对 象 ， 输 入 “删除 注册 ”并 在 “属性 ”面板 中 的 “链接 ” 文 
本 框 中 输入 useredelete.asp， 设 置 后 的 welcome.asp 页 面 如 网 3-92 所 示 。 
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3-92 ”加 入 “删除 注册 ”链接 








切换 到 useredelete.asp 页 面 。 由 于 需要 在 useredelete.asp 页 面 中 显示 用 户 的 注 


册 人 信息， 所 以 应 该 定义 一 个 记录 集 。 其 方法 与 制作 userupdate.asp 页 面 中 定义 记录 集 的 方法 
| 
在 “文档 ”窗口 中 插入 一 个 表单 。 将 鼠标 指针 放置 在 表单 中 ， 选 择 沫 单 栏 中 的 
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“插入 ”一 “表单 ”一 “按钮 ”命令 ， 在 表单 中 插入 一 个 按钮 ， 并 通过 对 应 的 “属性 ”面板 
将 该 表单 中 的 动作 设置 为 “提交 表单 ” 修改 按钮 名 为 “确定 删除 ” 设置 完成 后 的 页 面 如 图 
3-93 所 示 。 
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图 3-93 ”确定 删除 


打开 “服务 器 行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 沫 单 中 选 
择 “ 删 际 记录 ”命令 ， 将 打开 “删除 记录 ”对 话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 
从 “连接 ”下 拉 列 表 中 选择 connuser 作 为 数据 源 连 接 对 象 。 
从 “从 表格 中 删除 ”下 拉 列 表 中 选择 user 作 为 使 用 的 数据 库 表 对 象 。 
从 “选取 记录 自 ” 下 拉 列 表 中 选择 Recordsetl 记录 集 作 为 要 删除 的 记录 对 象 。 
在 “唯一 键 列 ”下 拉 列 表 中 选择 主键 字段 为 ID 
从 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 form1。 
在 “删除 后 ， 转 到 ”文本 框 中 设置 记录 成 功 删 除 后 ， 切 换 到 /userdeleteok.asp 网 页 。 
设置 完成 后 该 对 话 框 如 图 3-94 所 示 。 
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3-94 ”设置 完成 后 的 “删除 记录 ”对 话 框 











用 户 管 理 系 统 





设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 框 ， 返 回 到 “ 文 梢 ”窗口 。 

由 于 删除 记录 的 操作 是 不 可 换 回 的 ， 为 避免 用 户 误 操 作 应 该 在 页 面 中 设置 让 用 
户 取消 的 功能 。 在 “文档 ”窗口 中 输入 “ 单 击 此 处 取消 结束 会 话 ” 文 本 ， 然 后 设置 该 文本 链 
接 到 welcome.asp 页 面 。 

该 页 面 制 作 完成 后 如 图 3-95 所 示 。 
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选择 末 单 栏 中 的 “文件 ”一 “保存 ”命令 ， 将 该 文档 你 存 到 本 地 站 点 中 。 
当 用 户 删 除 成 功 后 ， 应 切换 到 成 功 删 除 信息 的 页 面 ， 制 作 删 除 注册 的 静态 网 员 
userdeleteok.asp 效果 如 图 3-96 所 示 。 
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于 资料 修改 与 删除 功能 测试 


编辑 工作 完成 后 ， 需 要 对 资料 修改 的 执行 情况 进行 测试 其 测试 步 怒 如 下 : 

打开 正 浏 览 磺 ， 在 地 址 栏 中 输入 http:/127.0.0.1/ index.asp， 打 开 index.asp 文 
件 。 在 该 页 面 中 输入 登录 信息 ， 登 录 成 功 后 ， 单 击 “ 修 改 您 的 注册 资料 ”链接 文本 ， 切 换 到 
userupdate.asp 外 面 ， 如 图 3-97 所 示 。 
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性 别 : @ 等 
电子 邮件 : test@163. com 











_ 密码 提示 问题 : 你 是 谁 ? 
< > + 密码 提示 答案 : [我 是 测试 者 
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留言 本 访谈 焦点 ”天 于 我 们 


























图 3-97 ”修改 用 户 注册 资料 
在 该 页 面 中 进行 一 些 修改 ， 这 里 修改 密码 ， 然 后 单 击 “提交 ”按钮 将 修改 结 
友 送 到 服 分 人 器 端 。 当 用 万 足 芝 更新 成功 后 , 渕 覧 益 会 切換 色 userupdateok.asp 页 面 中 ， 显 示 
资料 修改 成 功 的 信息 和 该 用 户 修 改 后 的 资料 信息 ， 并 提供 切换 到 资料 修改 页 面 和 切换 到 主页 
面 的 链接 对 象 ， 如 图 3-98 所 示 。 
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性 別 : @ a O 多 
电子 邮件 : test@163. com 
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密码 提示 答案 : 我 是 测试 者 
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图 3-98 更 新 记录 成 功 显示 页 面 
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“删除 注册 ”功能 的 方法 是 : 通过 单 击 “ 登 录 成 功 ” 中 的 “删除 注册 ”命令 进入 删除 页 
面 ， 删 除 注 册 人 信息， 如 网 3-99 所 示 。 
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图 3-99 删除 页 面 
上 上述 测试 结果 表明 ， 用 户 注册 资料 修改 和 删除 系统 已 经 成 功 制 作 完成 。 


找 回 密码 功能 


在 注册 新 用 户 时 要 求 新 用 户 提供 一 个 问题 和 答案 ， 然 后 利用 这 个 问题 和 答案 帮助 用 户 在 
态 记 秘 公 时 找 回 壮 失 的 密码 。 如 果 用 户 提 供 的 答 采 和 原 管 柔 相同 ， 束 可 以 找 回 壮 失 的 密码 ; 
合 则 ， 无 法 找 回 壮 失 的 密码 。 本 市 将 主要 介绍 如 何 实 现 站 点 中 的 密码 但 询 功 能 。 


3.6.1 
本 小 节制 作 找 回 密码 的 主要 页 面 lostpassword.asp, 具体 制作 歩 張 如 下 : 

将 制作 的 moban.asp 另存 为 lostpassword.asp 页 面 ， 使 用 Dreamweaver CSS 中 
提供 的 制作 静态 网 页 的 工具 完成 如 网 3-100 所 示 的 静态 部 分 。 

将 输入 用 户 名 的 文本 域 命名 为 inputname。 在 “文档 ”窗口 中 选中 表单 对 象 ， 
然后 在 其 对 应 的 “属性 ”面板 中 ， 在 “表单 ID” 文本 框 中 输入 form1， 在 “动作 ”文本 框 中 
输入 showquestion.asp 作为 该 表单 提交 的 对 象 页 面 。 在 “方法 ”下 拉 列 表 中 选择 “POST” 作 
为 该 表单 的 提交 方式 ， 如 图 3-101 所 示 。 
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3-100 lostpassword.asp 页面 
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3-101 设置 表单 提交 的 动态 属性 
当 用 户 在 lostpassword.asp 页面 中 输入 用 户 名 ， 并 单 击 “提交 ”按钮 后 ， 将 通 
过 表单 将 用 户 名 提交 到 showquestion.asp 负面 中 。 该 页 面 的 作用 束 是 根据 用 户 名 从 数据 库 中 
找到 对 应 记录 的 提示 问题 并 显示 在 showquestion.asp 页 面 中 ， 同 时 请 用 户 输 入 问题 的 答案 。 
将 制作 的 moban.asp 另存 为 showquestion.asp 页 面 ， 使 用 Dreamweaver CS5 中 提供 的 制作 着 
态 网 页 的 工具 完成 如 图 3-102 所 示 的 静态 部 分 。 
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在 “文档 ”窗口 中 选中 表单 对 象 ， 然 后 在 其 对 应 的 “属性 ”面板 中 ， 在 “ 动 
作 ” 文 本 框 中 输入 showpassword.asp 作为 该 表单 提交 的 对 象 页 面 。 在 “方法 ”下 拉 菜 单 中 选 
择 “POST” 作 为 该 表单 的 提交 方式 ， 如 图 3-103 所 示 。 接 下 来 将 输入 密码 提示 问题 答案 的 
文本 域 命名 为 inputanswer。 ©) 
打开 “ 绑 定 ”面板 ， 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 菜单 中 选择 “ 记 議 
录 集 (查询 )” 命 令 ， 打 开 “ 记 录 集 ”对 话 框 。 < 

















Form1 | 方法 PosT ママ 编码 类 型 | 慰 





| 表单 Tn 动作 showpassword. asp | コ 目标 wv 类 人) | news © 


图 3-103 ” 议 置 表单 提交 的 属性 


在 该 对 话 框 中 进行 如 下 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 Recordset1l 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connuser 数 据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 user。 

@ 在 “ 列 ” 选 项 组 中 先 选 择 “ 选 定 的 ” 单 选 按钮 ， 然 后 选择 字段 列表 框 中 的 username 
和 Question 两 个 字段 束 行 了 。 

@ 在 “人 沛 选 ” 栏 中 设置 记录 集 过 滤 的 条 件 为 username: =: 表单 变量 : inputname, 表示 
根据 数据 库 中 username 罕 段 的 内 容 和 从 上 一 个 网 页 中 的 表单 中 的 inputname 表 单 对 有 象 
传递 过 来 的 信息 是 否 完 全 一 致 过 小 记录 对 象 。 

完成 后 的 设置 如 图 3-104 所 示 。 



































































































































inputname 












































图 3-104 定义 “记录 集 ” 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定” 按钮， 关闭 该 对 话 杠 。 返 回 到 “ 文 
档 ” 和 窗口 。 将 Recordsetl 记录 集中 的 question 字段 绑 定 到 页 面 上 相应 的 位 置 。 

选择 采 单 位 中 的 “插入 ”一 “ 表 蛙 ”一 “隐藏 域 ”命令 ， 在 表 蛙 中 插入 一 个 表 
单 隐 藏 域 ， 然 后 将 该 隐藏 域 的 名 称 设 置 为 username。 
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选中 该 隐 癜 域 ， 切 换 到 “ 绑 定 ”面板 ， 将 Recordsetl 记录 集中 的 username 字 
段 绑 定 到 该 表单 隐 茂 域 中 ， 如 网 3-105 所 示 。 
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图 3-105 添加 表单 隐藏 域 


注意 : 
当 用 户 输入 的 用 户 名 不 存在 时 ， 即 记录 集 Recordsetl 为 空 时 ， 就 会 导致 该 页 面 不 能 正常 
显示 ， 这 就 需要 设置 隐藏 区 域 . 


在 “文档 ”窗口 中 选中 当 用 户 输入 用 户 名 存在 时 显示 的 内 容 即 整个 表单 ， 然 后 
单 击 “服务 占 行 为 ”面板 中 的 “+” 号 按钮 ， 从 打开 的 有 亲 单 中 选择 “显示 区 域 ” 一 “如 果 记 
录 集 不 为 容 则 显示 ”命令 ， 打 开 “ 如 果 记 录 集 不 为 容 则 显示 区 域 ”对 话 框 。 在 该 对 话 框 中 选 
择 记录 集 对 象 为 Recordset1。 这 样 上 只 有 当 记 录 集 Recordsetl 不 为 容 时 ， 才 显示 出 来 。 设 置 完 
成 后 ， 单 击 “ 确 定 ” 按 钮 ， 如 图 3-106 所 示 。 关 闭 该 对 话 框 ， 返 回 到 “文档 ”窗口 。 























天 灯 记 承 集 证 为 空 则 性 示 区 茂 





图 3-106 打开 的 “如 果 记 录 集 不 为 空 则 显示 区 域 ” 对 话 框 


在 网 页 中 编辑 显示 用 户 名 不 存在 时 的 文本 “对 不 起 ， 您 输入 的 用 户 不 存 
在 ! 请 单 击 这 里 重新 输入 ” 并 为 这 些 内 容 设置 一 个 “如 果 记 录 集 为 衬 则 显示 ”隐藏 区域 
服务 器 行为 ， 这 样 当 记 录 集 Recordsetl 为 空 时 ， 显 示 这 些 文本 ， 完 成 后 的 网 页 如 网 3-107 
所 示 。 
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3-107 ”设置 隐藏 区域 


下” 完善 密码 查询 功能 





当 用 户 在 showquestion.asp 负面 中 输入 答案 并 蛙 击 “查询 ”按钮 后 ， 服 务 絮 就 把 用 户 名 
和 密码 提示 问题 答案 提交 到 showpassword.asp 页 面 中 。showpassword.asp 页 面 就 以 用 户 名 和 
密码 提示 问题 答案 作为 参数 ， 然 后 在 数据 库 中 但 找 符合 条 件 的 记录 ， 如 果 找 到 符合 条 件 的 记 
录 ， 则 表明 答案 正确 ， 束 将 密码 显示 在 页 面 中 ; 如 果 找 不 到 符合 条 件 的 记录 ， 则 表明 答案 不 
正确 ， 束 将 显示 错误 信息 ， 并 提醒 用 户 草 独 输 入 ， 最 后 进行 测试 。 

将 制作 的 moban.asp 另存 为 showpassword.asp 页 面 ， 使 用 Dreamweaver CS5 中 
提供 的 制作 静态 网 页 的 工具 完成 如 网 3-108 所 示 的 静态 部 分 。 
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打开 “ 绑 定 ”面板 ， 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 来 单 中 选择 “ 记 

录 集 (查询)” 命 令 ， 打开 “记录 和 集 ” 对 话 杠 。 在 该 对 话 框 中 进行 如 下 设置 : 

在 “名 称 ” 文 本 框 中 输入 Recordsetl 作为 该 记录 和 集 的 名 称 。 
从 “连接 ”下 拉 列 表 中 选择 connuser 数 据 源 连接 对 象 。 
从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 user。 
在 “ 列 ” 选 项 组 中 先 选 择 “ 选 定 的 ” 单 选 按钮 ， 然 后 选择 字段 列表 框 中 的 

Username、Question 和 Answer 三 介 字 段 就 行 了 。 

@ 在 “人 沛 选 ” 柱 中 设置 记录 集 过 小 的 条 件 为 Answer: =: 表单 变量 ; inputanswer, 表示 
根据 数据 库 中 Answer 字 段 的 内 容 和 从 上 一 个 网 页 中 的 表单 中 的 inputanswer 表 单 对 象 
传递 过 来 的 信息 是 否 完全 一 致 过 波 记 录 对 象 。 

完成 的 设置 如 图 3-109 所 示 。 
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3-109 定义 “记录 集 ” 


单 击 “ 确 定 ” 按 钮 ， 关 闭 该 对 话 杠 ， 返 回 到 “文档 ”窗口 。 将 记录 集中 的 
username 和 password 两 个 字段 分 别 添 加 到 网 页 中 ， 如 图 3-110 所 示 。 
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3-110 加 入 的 记录 集 效果 











用 户 管 理 系统 











同样 需要 根据 记录 集 Recordsetl 是 否 为 衬 ， 为 该 网 页 中 的 内 容 设置 隐藏 区 
域 的 服务 器 行为 。 在 “文档 ”窗口 中 选中 当 用 户 输 入 密码 提示 问题 答案 正确 时 显示 的 内 
容 ， 然 后 单 击 “服务 器 行为 ”和 面板 中 的 “+” 号 按钮 ， 从 打开 的 末 单 中 选择 “显示 区 
域 ”一 “如 果 记 录 集 不 为 容 则 显示 ”命令 ， 打 开 “ 如 有 果 记 录 集 不 为 容 则 显示 区 域 ” 对 话 
杠 。 在 该 对 话 框 中 选择 “记录 集 ” 对 象 为 Recordset1。 这 样 ， 只 有 当 记 录 集 Recordsetl 
不 为 空 时 ， 才 显示 出 来 。 设 置 完成 后 ， 单 击 “ 确 定 ” 投 钮 ， 关 财 该 对 话 框 ， 返 回 到 “ 文 
档 ” 窗 口 。 

在 网 页 中 选择 当 用 户 输入 密码 提 示 问 题 答 架 不 正确 时 显示 的 内 容 ， 并 为 这 些 内 
容 设 置 一 个 “如 果 记 录 集 为 空 则 显示 ”隐藏 区 域 服务 器 行为 。 这 样 ， 当 记录 集 Recordsetl 为 
室 時 , 显示 这 些 广 本 3% 

完成 后 的 网 页 如 图 3-111 所 示 。 选 择 采 单位 中 的 “文件 ”一 “保存 ”命令 ， 将 
该 文档 保存 到 本 地 站 点 中 。 
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3-111 完成 后 的 网 页 效果 


到 密码 查询 测试 


将 相关 的 网 页 保存 并 上 传 到 远程 站 点 ， 就 可 以 测试 该 密码 僵 询 的 执行 情况 了 。 

打开 HE 浏览 融 ， 在 地 址 栏 中 输入 http://127.0.0.1 /index.asp， 打 开 index.asp 文 
件 。 单 击 该 页 面 中 的 “ 取 回 密码 ”文本 链接 ， 切 换 到 如 图 3-112 所 示 的 页 面 。 

当 用 户 进 入 密码 查询 页 面 lostpassword.asp 后 ， 输 入 并 向 服务 器 提交 自己 注册 的 
用 户 名 信息 。 当 输入 不 存在 的 用 户 名 ， 并 单 击 “ 提 交 ” 按 钮 后 ， 将 切换 a 到 showquestion.asp 页 
面 ， 该 页 面 将 显示 用 户 名 不 存在 的 错误 信息 ， 并 提供 一 个 切换 到 lostpassword.asp 页 面 的 链接 
对 象 ， 使 用 户 可 以 切换 到 1lostpassword.asp 页面， 并 重 独 输入 用 户 名 。 























动用 户 管理 系统 二 Nicrosoft Tnternet Explorer 
: 文件 ば ) 编辑 还 ) 查看 収 療 ぬ ) 工具 并) 帮助 册 ) 


Om O FEO Pm km do LAS AS 


SN 


开始 搜索 











1 地 址 Q) = http://127.0.0. 1/1ostpassword. as 


< 人 



































3-112 输入 要 查询 密码 的 用 户 名 


如 果 输 入 一 个 数据 库 中 已 经 存在 的 用 户 名 ， 然 后 单 击 “ 提 交 ” 按 钮 。IB 浏览 
器 将 自动 切换 到 showquestion. asp 页 面 ， 如 图 3-113 所 示 。 下 面 驶 应 该 在 showquestion.asp 页 
面 中 输入 密 公 提示 问题 的 答案 ， 以 测试 showquestion.asp 网 页 的 执行 情况 。 
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查询 密码 : 
职 回 密码 提示 问题 : 网 站 的 管理 者 是 谁 ? 
输入 正确 的 答案 : 
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3-113 showquestion.asp 网 页 


在 这 里 可 以 先 输 入 一 个 错误 的 答案 ， 检 查 showpassword.asp 页 面 中 是 否 能 够 显 

密码 提示 问题 不 正确 时 应 显示 的 错误 信息 。 

如 果 在 showquestion.asp 网 页 中 输入 正确 的 答案 ， 并 单 击 “查询 ”按钮 后 ， 浏 
时 右 将 切换 到 showpassword.asp 页 面 ， 并 显示 出 该 用 户 的 密码 ， 如 图 3-114 所 示 。 
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3-114 showpassword.asp 多面 


上 述 测 试 结 末 表明 ， 密 人 码 便 询 功 能 已 经 成 功 制作 完成 。 到 这 里 ， 用 户 礼 理 系统 的 第 用 功 
能 都 已 经 设计 并 测试 成 功 。 
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章 主要 介绍 如 何在 网 站 中 建设 留言 


板 系统 。 利 用 留言 板 ， 可 以 为 访问 网 站 的 
用 户 提 供 友 言 的 机 会 ， 让 他 们 及 时 准确 地 
发 表 目 己 的 观点 。 留 言 板 主要 用 到 了 创建 
存储 讨论 区 有 关 信 息 的 数据 库 、 议 定 
DSN、 定 义 站 点 、 创 建 数 据 库 连接 、 制 作 
ON cen 
示 多 条 记录 、 隐 疙 导航 条 链接 、 创 
rm 、 删 除 记 录 等 。 ee 
以 进行 进一步 扩展 。BBS 论坛 系统 其 
Fe 
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“享受 生 各 a (aa, semi 6 
す 殿 素 夫 0 食 9 | | 


本 章 的 实例 效果 


ルル 








教学 重点 


搭建 留言 板 管理 系统 开发 平台 に 
留言 板 系 统 的 规划 に ご 

留言 板 的 动态 网 面 设 计 に 

罗列 留言 动态 网 页 开发 に 

于 台 管 理 功能 的 设计 名 

留言 板 系统 测试 ビッ 
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| 搭建 留言 板 管理 系统 开发 平台 





留言 板 管理 系统 对 于 交互 型 的 大 型 网 站 是 非常 重要 的 ， 一 个 网 站 拥有 了 留言 板 功能 之 
后 ， 就 能 够 实现 访问 者 和 管理 者 之 间 的 沟通 。 本 章 选 择 了 一 个 以 留言 板 为 主要 功能 的 餐饮 网 
站 实例 ， 效 果 如 图 4-1 所 示 。 


eras Wi fe le 
FE 











し 4 コト し ょ まう 
Pi パチ か CO] 


Eo 


图 4-1 留言 板 功能 的 实例 效果 
建立 本 实例 的 开发 平台 需要 使 用 Photoshop 分 制图 请 ， 配 置 HS 站 氮 浏览， 建立 本 实例 








的 站 点 chap04, 使用 div+CSS 布局 静态 页 面 。 


2 由 使 用 Photoshop CS5 分 割 图 片 


下 面 就 开始 用 Photoshop CS5 切片 工具 分 割 首页 图 片 。 

目 先 在 本 地 计算 机 D 盘 建 立 站 点 文件 夹 chap04， 在 站 点 文件 夹 中 建立 第 用 文 
件 夹 (如 css、images、psd 文件 夹 )， 如 图 4-2 所 示 。 然 后 从 光盘 里 找到 站 点 chap04/psd 文 
件 夹 下 的 index.psd 文件 ， 将 其 复制 到 本 地 站 点 的 psd 文件 夹 中 。 




















: 文件 他) 编辑 人 下) 查看 名 ”收藏 上 工具 て) 和 玫 助 人 0 


Om © 落球 所 国 ・ 
; 地 址 0) | D: vehap04 











立 件 和 文件 夹 芷 务 
画 重 命 名 这 个 文件 来 
让 移动 这 个 文件 来 
[円 复制 这 个 文件 来 


も 将 这 个 文件 夹 发 布 到 


请 共享 此 文件 夹 
3 以 电子 邮件 形式 发 送 
该 文件 夹 内 的 交 件 

XK 珊 除 这 个 文件 来 








4-2 ”建立 站 点 文件 夹 











司 动 Photoshop CS5， 选 择 亲 单 栏 中 的 “文件 ”一 “打开 ”命令 ,打开 首 页 


index.psd 文件 ， 可 切 厂 的 效果 如 图 4-3 所 示 。 
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4-3 首页 的 可 切片 效果 

ET3) 在 图 层 上 关闭 一 些 可 链接 的 说 明文 字 ， 按 下 《Ctrl+H 组 合 键 ， 打 开 辅 助 线 视 

图 ， 先 用 辅助 线 分 割 好 需要 分 制 的 区 域 ， 然 后 按照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 14 个 
小 图 片 ， 如 图 4-4 所 示 。 
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4-4 整个 衣 页 分 割 后 的 效 末 


选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “が 散 ” 模式 , 
“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 4-5 所 示 。 

GEH5) 单 击 “ 储 在” 按钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 “ 保 存在 ” 右 侧 
的 下 拉 三 角 按钮 ”， 在 下 拉 列 表 中 选择 建立 的 chap04 文件 夹 ， 其 他 参数 保持 默认 值 ， 设 置 如 
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图 4-6 所 示 。 
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4-5 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “ 傈 存 ” 按 钮 ， 完 成 保存 页 面 的 操作 。 打 开 你 存 文 件 的 路 径 ， 可 以 看 到 月 
动 生成 了 一 个 名 为 images 的 文件 来。 文件 夹 中 是 页 面 分 割 后 的 小 图 片 ， 由 这 些小 图 片 组 成 
了 和 页 的 效果 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 4-7 所 示 。 


将 优化 结果 存 情 为 
保存 在 ): | chapo4 v| ③ 他 二 | 





Ea 中 本 (mi 了 工具 在 ) 時 男前 
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立件 名 ): index. html 
保存 美 型 で ): jmL 和 図 像 Gt.html) 取消 
设置 : 默认 设置 
切片 : 选中 的 切片 
4-6 “将 优化 结果 存储 为 ”对 话 框 设置 4-7 分 割 后 的 小 图 片 





2 配置 系统 站 点 服务 器 


接 下 来 使 用 IS 在 本 地 计算 机 上 构建 留言 板 管理 系统 的 站 点 。 
配置 系统 站 操 服务 天 的 步骤 如 下 : 
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首先 启动 IIS, 在 IHS 窗口 中 右键 单 击 “默认 网 站 ”选择 菜单 中 的 “属性 ” 命 
令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 4-8 所 示 。 

单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 站 点 文件 夹 路 径 为 
“D:chap04” 其 他 参数 保持 默认 值 ， 设 置 如 图 4-9 所 示 。 














网 站 。 |ISAPI 第 选 器 | 主 目录 | 文档 “| 目录 安全 性 | TTP 头 | 自 定义 错误 | 『 头 自 定义 错误 ASP.NET ba 
et 网 站 ISAPI 第 选 器 主 目录 | ”文档 目录 安全 性 “| 








a === 连接 友 院 源 时 的 内 容 来 源 

Mt ©): Sa _| 人 @ 此 计算 机 上 的 目录 四 ) 

IP 地 志 ): (全部 未 分 配 ) v 〇 另 一 台 计 算 机 上 的 共享 8) 

TCP 端口 (T): 80 | | 〇 重定 向 到 URL⑪) 
ーー 本 地 略 径 (C): |D:\khapo4 


口 脚 本 资源 访问 で) 口 记录 访问 QW) 
连接 超时 QD: | 秒 回 读 取 四 索引 资源 上 ) 


口 写 入 
保持 HTTP 连接 K) 品目 Sg (E) 


回 息 用 日 志 记 录 ) 一 EEE = 
口 | 口 
活动 日 志 格 式 の : 应 用 程序 名 如 : 。。 芋 认 应 用 程序 | Me 
W3C 扩展 日 志 立 件 格式 | [属性 )... 开始 位 置 : 伍 认 网 站 > 
L | G)... 
- [RE® 


执行 权限 到) : 印 脚 本 
应 用 程序 保护 如: 中 (共用 ) 


























图 4-8 “默认 网 站 属性 ”对 话 杠 图 4-9 设置 网 站 的 “本 地 路 径 ” 


单 击 “ 人 确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 设置 ， 由 于 前 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 TE 浏览 右 在 地 址 
位 中 输入 http:/127.0.0.1， 即 可 打开 页 面 分 割 后 的 效 末 。 如 采 可 以 浏览 到 Photoshop CS5 分 割 
后 的 网 页 效果 ， 说 明 站 点 服务 右 的 配置 已 经 完成 。 


4.1.3 创建 编辑 站 点 chap04 


使 用 Dreamweaver CS5 进行 网 页 布局 设计 时 ， 首 先 需 要 使 用 定义 站 点 问 导 定义 站 点 ， 具 
体 的 操作 步骤 如 下 : 

打开 Dreamweaver CS5， 选 择 菜 单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 
4 生理 点 ”对 话 框 。 

早 击 右边 的 “ 狐 建 ”按钮 ， 从 弹出 的 下 拉 麻 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ” 对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ” chap04。 

“本 地 站 点 文件 夹 ” Di\chap0 小 。 

如 图 4-10 所 示 。 

早 击 “分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 右 名 称 ”: chap04。 

“连接 方法 ” 本 地 /网 络 。 

“服务 占 文 件 夹 ” Di\chap04\。 

“ Web URL”: http://127.0.0.1。 
























ー ” 
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配置 后 的 “测试 服务 右 ” 的 参数 设置 如 网 4-11 所 示 。 


站 点 设置 对 和 锣 chap04 


Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweawyer 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文 件 的 计算 机 上 的 本 地 文件 
版 本 控制 夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 到 web 上 的 服务 器 上 的 远程 文件 夹 。 


* ”高 级 设置 














您 可 以 在 此 处 当 Dreamweayer 站 点 选择 本 地 立 件 来 和 名 称 。 
站 点 名 各 
本 地 站 点 文件 来; 白 





图 4-10 ”定义 站 点 


站 点 设置 对 和 锣 chap04 
站 点 -一 一 一 一 二 
服 科 回 EE 
版 本 控制 服务 器 名 称 :cm | 
* ”高 级 设置 
连接 方法 ; | 本 地 /网络 i 
服务 器 文件 赤 ; [Da ”| 同 
WebURL [httpWlz7ol | 




















4-11 设置 “服务 器 ”参数 


单 击 “确定 ”按钮 ， 完 成 站 点 的 定义 设置 。 在 Dreamweaver CS5 中 已 经 拥有 了 
刚才 所 设置 的 站 点 。 


于 证 yiviCSS 布 局 网 页 


实例 静态 网 页 部 分 使 用 div+CSS 布局 设计 实现 ， 整 体 的 页 面 布局 规划 设计 如 图 4-12 


所 示 。 
使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 ASP 文档 格式 ， 


将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


























第 4 意 症 人 の あき 6 





ーーーーー ニ ーーーーー ニ ーーーーーーーーーーーーーー ニ ーーーーー ニ ーーーーー ニ ーーーーーー ニ ーーー ニーーー ニ ーーーー ニ ーーーーー 


人 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 


ーー 


ー 
#enjoy 


I 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
#tul 
| 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
1 
\ 


~ 
CD 
選 . 
© 
< 

ン ン 


站 
=， 
C=. 
SS 
ご 





1 
1 
1 
1 
1 
1 
1 
1 
1 
#tu | 
1 
1 
1 
#card , 
1 
1 
#server , 
1 
\ 7 
\ VA 
™ へ の ノン 
ao ヽ 
7 1 
1 1 
1 1 
1 1 
1 人 
I #copyright I 
| ， #bottom 
| | 
1 1 
1 1 
\ 7 
へ ン 


ee 


图 4-12 页 面 整 体 布局 设计 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>// 宣 告 为 ASP 文档 

<IDOCTYPE html PUBLIC "-/W3C/DID XHTML 1.0 Transitional/EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet" href="css/style.css" type="text/css" /> 

<title> 留 言 系统 </title> 

</head> 


其 他 div 的 布局 代码 如 下 : 


<body> 
<div id="top "> 
<div 1d="logo"></div> 


<div 1d="banner"> 
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<div class="banner1 "> 

<a href="# が > 主 页 </a> | <a hre 全 "#> 注 册 </a> | <a href="# が > 登 录 </a> | <a hre 伟 "如 > 网 
站 地 图 </a> | ”<a hre 伍 "#"> 收 藏 本 站 </a></div> 

<div class="banner2"> 


<a hre 伍 "/index.asp"> 自 ”页 </a> <a hre 伍 "/InsertMessage.asp"> 我 要 留言 </a> 
<a href="/ListMessage.asp"> 查 看 留言 </a> <a hre 伍 "/Admin.asp"> 后 人 台 管 理 </a> 
<a hre 伍 "#"> 关 于 我 们 </a></div> 
</div> 
</div> 


<div id="mid"> 
<div 1d="enjoy"><1mg src="/images/index 03.g1f"></div> 
<div 1d= "news"><lmg src デ "71mages/index 04.gif"></div> 
<div id="nei"> 


一 1 


<div class="nei"> 

<a hre 伍 "#"> 为 了 迎接 五 一 劳动 入 ， 公 司 优惠 打折 活动 ! </a> 

<a hre 全 ="#"> 下 周一 全 体 员 工 在 会 议 室 开会 ， 请 互相 转告 ! </a></div> 
</div> 
<div 1d= "tu"><lmg src="/images/index 06.g1f"></div> 
<div id="tuijian"><img src="/images/index 07.gif"></div> 








<div 1d="ming"> 
<div id="tul "><img src="/1mages/index 08.gif"></div> 
<div id="tu2"><img src="/1mages/index 09.g1f"></div> 
<div id="tu3 "><img src="/1mages/index 10.g1f"><7div> 
</div> 
<div 1id="card"><img src="/images/index 11.gif"></div> 
<div id="dian"><img src="/images/index 12.g1f"></div> 
<div id="server"><img src="/images/index 13.gif"></div> 
</div> 
<div id="bottom"> 
<div id="copyright"><img src="/images/index 14.gif"></div> 
</div> 
</body> 
</html> 


div 布局 完成 后 需要 将 该 页 面 保存 ， 选 择 滋 单 栏 中 的 “文件 ”一 “另存 为 ” 命 
令 ， 打开“ 另存 为 ”对 话 框 ， 在 “文件 名 ”文本 框 中 输入 文件 名 为 “index.asp”， 和 单 击 选择 
“保存 类 型 ”后 面 的 下 拉 三 角 按钮 ， 在 打开 的 下 拉 列 表 中 选择 Active Server Pages (*.asp; 
*.asa) 来 单项 ， 如 图 4-13 所 示 。 单 击 “ 保 存 ” 投 钮 完成 首页 的 布局 设计 。 

在 站 点 中 建立 css 文件 夹 ， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


/# 整 体 页 面 css*/ 
*{ margin:Opx; 




















padding:Opx:! 
body{ width: 100%; 
height: 100%; 
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文件 名 ) : index. asp 保存 (8) 


ww 
保存 类 型 7): Server Fages (*. asp ;水 . asa) wv 取消 














图 4-13 “ 态 存 为 ”对 话 框 设 置 


font-size: 12px; 
background-color:#fdecc7: 























} 
な 设置 所 有 图 片 的 边框 为 0*/ 
img { 
border:0;} 
な 设置 最 外 层 居 中 显示 ， 实 现 让 整个 页 面 居 中 显示 */ 
#top,#mid,#bottom{ 


margin: auto; 
width: 1000px: 

} 
a:link { 
color: #000000; 
text-decoration: none; 
} 
a:visited { 
text-decoration: none: 
color:#fff: 
} 
a:hover { 
text-decoration: underhne: 
color:#C77B32; 
} 
a:active { 
text-decoration: none; 
color: #000000; 
1 
な 设置 左 浮 动 的 标签 */ 
#logo,#banner,#enjoy,#fnews,#nei, 
#tu,#tuijian,#ming,#tul が tn2.#tu3, 
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#card,#dian,#server{ float:left:\ 
/*top 部 分 
#logo{ width:206px: 
height:126px: 
background-image:url(/1mages/index 01.gt):! 
#banner{ width:794px: 
height:126px: 
background-image:url(1mages/index 02.gif):) 
.bannerl 1 width:270px: 
height:16px: 
margin-left:475px; 
margin-top:20px; 
color:#8d4f06; 
) 
.bannerl a:hnk { 
color: が 000000: 
text-decoration: none: 
} 
.bannerl a:visited { 
text-decoration: none: 
color:#8d4f006; 
} 
.bannerl a:hover { 
text-decoration: underhne: 
color:#FFF:; 
} 
.bannerl a:active { 
text-decoration: none: 
color: #000000; 
} 
.banner21 width:630px: 
height:30px: 
margin-left:8Spx; 
margin-top:23px; 
font-size: 18px; color:#FFF;} 
/*mid 部 分 */ 
#mid 1 background-image:url(/1images/backcolor.gt): 
) 
#ne11 width:451px: 
height:103px: 
background-image:url(/1mages/index 05.gif); 
) 
.nel{ width:300px: 
height:35px: 
margin-left:120px: 
margin-top: 15px; 
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Ine-height:20px: 
color:#FFF;t 

#book{ 
margin-left: 120px; 
margin-top: 15px; 
margin-bottom:20px; 
Ine-height:30px: 

} 


制作 完成 后 在 下 浏览 右 中 的 显示 效果 如 图 4-14 所 示 。 


UAL 
| 
a 要 羡 
| 17000 Orn 


Or234-1507 @ 
变 痊 生日 并 
隘 务 中 心 


em | ジー td 








图 4-14 ”制作 完成 的 首页 效果 
将 首页 的 中 间 部 分 删除 ， 另 存 为 moban.asp 作为 二 级 页 面 ， 如 图 4-15 所 示 。 





rT 蝙 昼 mi 看 看 "0 東 麗 品 ! rr 悪 還 画 
ma・9 回 国電 用 m 支 mmm Q 四季 所 ・ 


请 量 时] 還 | utp: fl a 











图 4-15 ”制作 的 三 级 页 面 效果 


Section 





留言 板 系 统 规划 


本 节 将 介绍 留言 板 系 统 的 规划 设计 和 数据 库 设计 ， 主 要 包括 创建 留言 板 数 据 库 、 设 定 系 
完 DSN 和 创建 数据 库 连 接 等 环 市 。 
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| 系统 规划 设计 


首先 对 留言 板 登 录 系 统 押 需要 的 页 面 结构 作 一 个 大 体 的 规划 。 要 利用 页 面 完成 留言 板 的 
功能 ， 需 要 一 个 页 面 来 为 用 户 提供 进入 留言 板 的 入 口 ， 通 背包 含 指 癌 发 言 页 面 的 链接 和 指 问 
租 看 留言 的 链接 ;还 需要 一 个 页 面 用 来 允许 用 户 输入 和 递交 留言 ， 最 后 ， 还 要 设计 一 个 页 面 
显示 留言 。 所 以 ， 访 留言 板 系统 主要 由 以 下 一 些 动态 网 页 构成 。 

@ index.asp: 提供 进入 留言 板 的 主页 。 

InsertMessage.asp: 用 户 发 言 的 页 面 。 
ListMessage.asp: 主题 列表 页 面 。 
ShowMessage.asp: 显示 留言 内 容 的 页 面 。 
Admin.asp: 用 于 登录 后 台 管 理 的 页 面 。 
DeleteMessage.asp: 选择 删除 多 余 的 留言 页 面 。 
Deleteok.asp: 删除 多 余 留 言 的 页 面 。 


リコ 数 据 護 疫 計 ) 


留言 板 的 制作 需要 设计 存储 发 言 用 户 资 料 的 数据 库 文 件 和 用 于 后 台 登 录 管 理 留言 板 的 用 
户 信息 数据 库 文 件 。 要 在 数据 库 中 保存 用 户 的 留言 信息 ， 需 要 设计 以 下 一 些 内 容 : 留言 人 姓 
名 、 留 言 时 间 、 留 言 人 的 联系 地 址 (通常 是 e-mail 地 址 )、 留 言 主 题 和 留言 内 容 。 要 在 数据 
库 中 另 创建 一 个 数据 表 用 于 后 从 登录 管理 使 用 ， 主 要 有 用 户 名 和 密码 就 可 以 。 

留言 板 数据 库 的 设计 步骤 如 下 : 

首先 要 设计 数据 库 的 罕 段 标准 ， 可 以 在 数据 库 中 采用 如 表 4-1 所 示 的 字段 。 这 
里 用 于 存储 留言 资料 的 数据 表 的 名 称 是 Message。 

表 4-1 Message 数据 的 字段 设计 













































































项 目 字段 名 称 数据 类 型 字段 大 小 必 填 字段 人 允许 空 字符 串 索 3 引 
主题 编号 ID 自动 编号 长 整 型 有 “无 重复 ) 
发 言 人 姓名 author 文本 20 是 合 の 
留言 主题 subject 文本 100 是 省 无 
日 期 和 时 间 time 文本 20 是 十 无 
邮箱 地 址 email 文本 50 从 是 天 
留言 内 容 content 备注 长 整 型 否 是 无 





用 于 存储 后 人 台 管 理 用 户 的 数据 表 名 称 是 Admin。 可 以 在 数据 库 中 采用 如 表 4-2 








所 示 的 字段 。 
表 4-2 Admin 数据 的 字段 设计 
项 目 字段 名 称 数据 类 型 字段 大 人 小 必 寺 字 段 允许 军 字 符 串 索 引 
主题 编号 ID 目 动 编号 长 整 型 有 “无 重复 ) 
后 台 登 录 姓 名 Admin 文本 20 の 合 无 
后 台 登 录 密 但 Password 文本 20 是 と 无 
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注意 : 

Admin 数据 字段 名 称 的 用 户 名 及 密码 是 可 以 任意 修改 的 ， 在 网 站 建设 初期 ， 可 以 将 初始 
值 均 设置 为 Admin， 这 样 匈 于 测试 操作 ， 在 上 传 到 服务 器 进行 使 用 时 ， 请 把 用 户 名 和 密码 设 
置 成 自己 的 用 户 名 和 窗 码 。 


首先 运行 Microsoft Access 2007 程序 。 单 击 “ 空 白 数据 库 ” 按 钮 岂 |， 在 主 界面 
的 右 侧 打开 “ 衬 白 数据 库 ” 面 板 ， 如 图 4-16 所 示 。 单 击 “ 空 日 数据 库 ” 面 板 上 的 “浏览 到 
某 个 位 置 来 存放 数据 库 ” 按 钮 芒 ， 打 开 “ 文 件 新 建 数 据 库 ” 对 话 框 。 


‘3) の - で 2 Microso ft Access 















| 开始 人 佑 历 croso 开 OU1pce Access 


A gpg | BS ms 
レ ] PV1sshwdbtsbop 


国 5 heywdbtshap 


0 Pt EE 
に i 0 し 1 に 
ph 
9, 





区 但 年 2007 Microtoft Office tyetem 
的 这 程 中 厅 职 是 条 站 二 

*# Access 2007 丑 户 玉 本 指南 

> 合用 六 侣 多 和 和 号 欢 硬 沪 记 挫折 有 有 对 傅 


4-16 打電 “空白 数 据 麻 "面板 





在 “保存 位 置 ” 后 面 的 下 拉 列 表 框 中 选择 前 面 创建 站 点 chap04 中 的 data 文件 
夹 ， 在 “文件 名 ”文本 框 中 输入 文件 名 message， 为 了 让 创建 的 数据 库 能 被 通用 ， 在 “保存 
类 型 ”下 拉 列 表 框 中 选择 “Microsoft Office Access 2000 数据 库 ” 选 项 ， 如 图 4-17 所 示 。 


文件 基建 丈 扣 上 谎 











4-17 “文件 新 建 数据 库 ” 对 话 杠 
单 击 “ 确 定 ” 投 钮 ， 返 回 “ 衬 日 数据 库 ” 面 板 ， 再 单 击 “ 宇 日 数据 库 ” 和 面板 中 
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的 “创建 ”按钮 ， 即 在 Microsoft Access 中 创建 了 一 个 message.mdb 数据 库 文 件 ， 同 时 
Microsoft Access 目 动 默认 生成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 如 图 4-18 所 示 。 


(9) 人 - 和 工具 TBSEa ロ を : 数据 库 [Access 2000 六 性 司机 | = Mieres_, 
= 一 天 拘 他 证。 計 通 下呂 。 浅 训 本 工 只。 可 或 胡 


sz 国 開 = 電信 | 到手 
| rit a 前 阅 列 ーー 格式 | 


吉本 1 





图 4-18 创建 的 默认 数据 表 


右键 单 击 “ 表 1: 表 ”， 打 开 快 捷 末 和 蛙 ， 选 择 快 捷 末 竺 中 的 “设计 视图 ” 命 
令 ， 打 开 “ 为 存 为 ”对 话 框 ， 在 对 话 框 中 的 “ 表 名 称 ” 文 本 框 中 输入 数据 表 名 称 message, 如 
图 4-19 所 示 。 





表 名 称 幼 : 


确定 取消 








4-19 “另存 为 ”对 话 框 
单 击 “ 确 定 ” 按 钮 ， 系 统 将 自动 打开 创建 好 的 message 数据 表 ， 如 图 4-20 所 示 。 


[= 层面。 mesiage : 数据 村 [Arcess 2000 廊 性 柄 十] = Micrcsoft Areess 加 更 
~ 到 滑 。 問 是 。 対 配 酸 琶 。 請 狂 工員 治 i 


四 ・-1 a 下 点 茜 3 デコ 
国 国 六 用 5 四 区 
上 時 a 唱 竹 机” 重 3 
柱 惠 工 風 











iT 
记 有 三 = | mg 四 
Mr dt s | 半 民 大 新 聖 握 農 型 说 明 | 
习 mesage: 副 ka 周 自动 蝙 号 国 
| EE 
IE 
字 租 本 小 に ーー | 
号 重 ET | 
格式 
上 | 可 [无 重山) 
看 膳 际 过 
ーー ニー 幸 隐 名 际 最 质 可 本 4 沾 于 和 | 包 于 三 隔 |， 六 
况 率 对 齐 電電 F1 好 可 查看 有 有 关 李 隐 各 标的 相 风 。 
| | 
EECEETTTRDETTT | 


4-20 建立 的 message 数据 表 
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按 表 4-1 输入 各 字段 的 名 称 并 设置 其 相应 属性 ， 结 末 如 图 4-21 所 示 。 


国 message 





字段 名 称 | 数据 类 型 说 明 ー 
¥ |ID 自动 编号 園 
suh ject 文 本 
author 文 本 
enail 文 本 
time 日 期 /时间 
备注 


‘content 














自动 输入 到 该 字段 中 、 作 为 新 记录 的 值 




















图 4-21 创建 表 的 字段 


说 明 : 
其 中 time 字段 用 于 保存 留言 被 存 入 数据 库 的 时 间 ， 可 以 在 Access 中 ， 将 其 默认 值 设 置 
为 “Now0”， 如 图 4-21 所 示 。 这 样 每 当 记 录 被 保存 时 ， 都 会 自动 计算 出 正确 的 时 间 。 


编辑 完成 ， 单 击 “ 保 存 ” 按 钮 加 ， 完 成 message 数据 表 的 创建 。 
同 歩 張 ②ー⑨, 介 建 数 据 表 Admin， 创 建 的 数据 表 如 图 4-22 所 示 。 














Ps 回 の で = 表 工 具 Admin - Microsoft Access ニー 2 xX 
i ー。。 = 
中 | 开始 | 创建 ”外 部 数据 。” ”数据 库 工具 数据 表 @ - mx 
品川 A 生出 時 川 約 全 記 ウー 加 = FPF | 的 薪 刍 转 简 
BZ z) 1 ーー 莹 简 转 竹 
视图 | 莫 贴 板 | 字体 | 格式 文本 | 记录 | A* | 自选 器 调 莹 至 切换 窗口 ”查找 
| A Y 路 简 繁 转换 
マ Bd ェ | | | 有 窗 体 大 小 r 
视图 | | | | 排序 和 税 选 窗口 | 中文 简 繁 转换 
表 マ < ID ~ Admin ・|Password ・ 族 學 話 学 産 
Admin 1 admin admin 
コ 米 (新建 ) 
message 
记录 :4 * 第 1 項 ( 共 1 項 ) "Hs | 浆 无 篇 选 占 || 搜索 
"数据 表 ” 视 图 | 数字 | 川 回 | 昌 | 此 | 铝 慨 


4-22 创建 Admin 数据 表 
最 后 ， 关 闭 Access 2007 软件 。 至 此 数据 库 建 立 完毕 。 





在 数据 库 创 建 完成 后 ， 需 要 在 Dreamweaver 中 建立 数据 源 连接 对 象 ， 才 能 在 动态 网 页 中 
使 用 这 个 数据 库 文件 。 有 具体 连接 步骤 如 下 : 

依 次 単 市 “ 控 制 面板 ”ー “管理 工具 ”ー “数 据 源 (ODBCJ ”一 “系统 
DSN” 逃 項 本 , 打 井 “ODBC 数据 源 管 理 器 ”的 “系统 DSN” 选 项 卡 ， 如 图 4-23 所 示 。 
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单 击 “ 添 加 (D)” 按 钮 ， 打 开 “ 创 建新 数据 源 ” 对 话 框 ， 在 “ 倒 建 新 数 所 
源 ” 对 话 杠 中， 选择 Driver do Microsoft Access (*#*.mdb) 选项 ， 如 图 4-24 所 示 。 


を 10DBC 数据 源 管 理 腕 


用 户 DSH 系统 DSH | 文件 DSN | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
选择 您 想 汶 其 安 动 程 
系统 数据 源 ): 选择 您 想 涛 其 安装 数据 源 的 驱动 程序 (3) 


驱动 程序 


Driver da Microsoft para arquivos texto [x*. 
Driver do Microsoft dBase ([*. dbf) 
Driver do Microsoft Excel tt. xls) 
Driver do Microsoft Paradox (*.db ) 
Driver para o Microsoft Visual FoxFro 
Microsoft Access Driver (*.mdb) 
Microsoft Access-Treiber [*.mdb) 
dBase Driver [*. dbf) 
ase VFF Driver (x. dbf) 


アデ ・ *~ 








图 4-23 “ODBC 数据 源 管 理 研 ”中 的 图 4-24 “创建 新 数据 产 ” 对 话 框 
“系统 DSN” 选 项 卡 
单 击 “完成 ”按钮 ， 打开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 
源 名 (N)” 文 本 框 中 输入 dsnmessage， 如 图 4-25 所 示 。 





ODBC Hicrosoft ACCESS rE 
数据 着 省 六 ): 

说 明 血 ): 

数据 库 


数据 库 : Hitchapn4tdataimassage. mdb 
选择 总 1.. . | 创建 忆 ].. . | 修复 RE)... | 压 管 问 )... | 
了 系 六 数 措 库 


* 元忠) 
『 誤 指 座 還 ): 


于，| 选项 (> | 





图 4-25 “ODBC Microsoft Access 安装 ”对 话 框 


早 击 “选择 (S)” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 框 ， 蛙 击 “ 驱 动 嚣 (V)” 
文本 框 右 侧 的 下 拉 三 角 按钮 品 ， 从 下 拉 列 表 框 中 找到 在 创建 数据 库 步骤 中 数据 库 所 在 的 盘 
符 ， 在 “目录 (D)” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 左上 方 “ 数 
据 麻 名 (A)” 选 项 组 中 的 数据 库 文 件 message.mdb， 则 数据 库 名 称 目 动 添加 到 “数据 库 名 
CA)” 下 方 的 文本 框 中 ， 如 图 4-26 所 示 。 

找到 数据 库 后 ， 单 击 “ 人 确定 ”按钮 回 到 “ODBC Microsoft Access 安 装 ” 対生 
框 中 ， 再 次 单 击 “ 确 定 ” 按 钮 ， 将 返回 到 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 选 项 
卡 ， 可 以 看 到 “系统 数据 源 ” 中 已 经 添加 了 一 个 名 称 为 “dsnmessage” 驶 动 程 序 为 “Driver 
do Microsoft Access 〈*.mdb)” 的 系统 数据 源 ， 如 图 4-27 所 示 。 


























第 4 意 還 仁和 き 


を 0DBC 数据 源 管理 回 
用 户 nsm 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系统 数据 源 (3): 


数据 库 名 &) 目录 ⑪) : 
[message. mdb d: ‘chapDd\data 


message. mdb 


立件 美 型 T): 红 动 器 Y): 
IAccess 数据 库 人 fr. me | | d: 新吉 巻 ”| 





图 4-26 ”选择 数据 库 图 4-27 添加 系统 数据 源 后 的 “系统 
DSN” 选 项 卡 





再 次 单 击 “确定 ”按钮 ， 完 成 “ODBC 数据 源 管理 器 ”中 “系统 DSN” 的 
设置 。 

局 动 Dreamweaver CS5, 打 井 前 面 制作 的 index.asp 静态 页 面 。 在 Dreamweaver 
软件 中 执行 菜单 中 的 “文件 ”一 “窗口 ”一 “数据 库 ” 命 令 ， 打 开 “ 数 据 库 ” 面 板 ， 如 图 4-28 
所 示 。 

单 击 “ 数 据 库 ” 面 板 中 的 [天 按钮 ， 弹 出 如 图 4-29 所 示 的 菜单 ， 选 择 “ 数 据 源 
名 称 (DSN)” 选 项 。 





新 共 库 “| 硕 杰 志 关 | 病 二 关系 行 二 
本 t 衝 時 行 放 


直 一 立 折 美 型 - 店 F VWEScript 








若 雪 在 该 册 和 面 上 司 用 动态 数据 : 
we 1 汶 语 亲人 忻 章 建 站 点 。 
wv 选择 一 种 立 档 尖 型 。 


we 。 3. 设置 站 点 的 测试 服 莹 器 。 
4. i + 按钮 创建 这 


目 定 忌 壹 接 字 桂 审 
唐橋 旧名 和 DSH】 





图 4-28 “数据 库 ” 面 板 图 4-29 ”选择 “数据 源 名 称 “DSN) ”选项 





打开 “数据 源 名 称 (DSN )” 对 话 框 ， 在 “连接 名 称 ” 文 本 框 中 输入 
coonmessage， 单 击 “ 数 据 源 名 称 (DSN)” 下 拉 列 表 框 右 侧 的 下 拉 三 角 按 钮 名， 从 打开 的 数 
据 源 名 称 (DSN) 下 拉 列 表 中 选择 dsnmessage， 其 他 保持 默认 值 ， 如 图 4-30 所 示 。 

在 “数据 源 名 称 CDSN)7” 页 面 中 ， 单 击 “ 确 定 ” 按 钮 后 完成 此 步骤 。 此 时 在 
“数据 库 ” 面 板 中 的 内 容 应 如 网 4-31 所 示 。 

在 网 站 根 目录 下 将 自动 创建 一 个 名 为 Connections 的 文件 来， 该 文件 夹 内 有 一 
个 名 为 coonmessage.asp 的 文件 ， 它 可 以 用 记事 本 打开 ， 内 容 如 图 4-32 所 示 。 
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数据 源 名 称 (D5NH) 





连接 名 称 : 
数据 源 名 称 (DSH): dsnmessage 








用 戸 名 : 」 _ 

密码 : ] 

reamweayer 应 连接 : 〇 使 用 测试 服务 器 上 的 DSH 
〇 使 用 本 地 DSH 











图 4-30 ”选择 数据 源 名 称 





rr: Ld 4 二 记事 本 

文件 你 ) 编辑 下 ) 格式 Q) 查看 QM 帮助 0) 

くる へ 
" FileName="Connection odbc conn_dsn.htm" 
' Type="ADO" 

' DesigntimeType=""ADO" 

' HTTP="false" 

' Catalog="""" 

' Schema="'" 

Dim Hl coonmessage_ STRING 

HM coonmessage STRING = "dsn=dsnmessage;" 
る > 


十 一 下 柏 美 弄 FVEScrint ( さ 








图 4-31 设置 的 数据 库 图 4-32 上 自 効 生 成 的 coonmessage.asp 文件 





实例 中 还 有 用 于 后 台 管 理 的 数据 表 Admin.mdb 需要 进行 连接 ， 在 制作 的 时 候 
为 了 区 分 连接 ， 我 们 将 单独 建立 一 个 coon 的 DSN 连接 ， 设 置 如 图 4-33 所 示 。 


数 据 江 名 和弥 (IDSJ) 


连接 名 称 : |coon_ 
数据 源 名 称 DSN) ET 
用 户 名 : | | 
密码 : | 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSH 
〇 使 用 本 地 DSH 




















图 4-33 设置 coon 后 台 管 理 连接 


单 击 “ 人 确定 ”按钮 ， 完 成 数据 库 连 接 。 此 时 的 “数据 库 ” 面 板 如 图 4-34 所 示 。 





慧 蕉 库 


:+ 一 站 档 类 型 : EF VWEScript で 


a 








I caommessage 


图 4-34 建立 的 两 个 数据 表 连 接 对 和 象 





留言 板 系 统 














制作 留言 板 的 动态 功能 页 面 ， 首 先 需 要 制作 用 户 发 言 的 页 面 InsertMessage.asp、 主 题 列 
表 页 面 ListMessage.asp、 显 示 留 言 内 容 的 页 面 ShowMessage.asp， 本 贡 将 介绍 如 何 完 成 这 些 
动态 功能 页 面 的 设计 与 制作 。 









用 户 留 言 的 功能 主要 在 InputMessage.asp 页面 中 进行 ， 在 该 页 面 中 ， 提 供 多 个 文本 框 表 
单 对 象 ， 人 允许 用 户 在 其 中 输入 留言 ， 当 用 户 单 击 “ 提 交 ” 按 钮 时 ， 实 际 上 就 已 经 将 记录 添加 
到 数据 库 中 。 

插入 留言 页 面 的 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 InsertMessage.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “ 插 











入 页 ”。 在 文档 中 修改 布局 效果 ， 插 入 表单 及 文本 域 ， 完 成 的 硬 态 页 面 效 末 如 图 4-35 所 示 。 





DN 文人) 的 必 0) 查看 tm 押入 T) 档 汉 人 振 式 0) 命 を c) 站 点 人 5 全 口 T) 情動 OO | Ei 私 ロー ェ ー 
cai faer Nr vip ー 





NM | 拱 娄 | 设计 | 。 本 由 作 人 ゆ 。 し て 須玉 用 。、 失 本 ん. や ご 回) 到 ハ 本 
站 全 地 直 [ 


basges 


oto Wp 


€ > 
hdr> Cdivias DD i vibsek> Cfare> p> [ie om -1T4 5 T7112 な PGR) 


| <> mm | 宙 式 ) 入 各 | v 7 EE Mf 拓 ) 
bh CN 项 加 元 マッ 证 这 人 Y 已 HR 
| 頁 遇 潤 性 .. | 





< > 
1 个 让 浪 项 日 实 这 让， 马 并 383 
【本 


4-35 ”插入 页 面 的 硬 态 部 分 效果 











注意 : 

在 为 表单 对 象 命 名 时 ， 由 于 表单 对 象 中 的 内 容 已 经 被 添加 到 Message 表 中 ， 可 以 将 表单 
对 象 名 命名 为 与 域 相应 字段 名 称 相 同 。 例 如 ， 将 用 于 添加 主题 的 文本 框 命 名 为 subject， 把 用 
于 发 言 内 容 的 文本 域 命名 为 content 等 。 这 样 做 的 目的 是 当 该 表单 中 的 内 容 被 添加 到 Message 
表 中 时 它们 会 自动 配对 。 

还 需要 设置 一 个 验证 表单 的 动作 ， 用 来 检验 浏览 者 在 表单 中 其 与 的 内 容 是 合 满 
足 数 据 库 中 表 Message 中 字段 的 要 求 。 这 样 ， 在 将 用 户 填 写 的 注册 资料 提交 到 服务 器 之 前 ， 
会 对 用 户 填 写 的 资料 进行 验证 。 如 果 有 不 符合 要 求 的 信息 ， 将 同 浏览 者 显示 错误 的 原因 ， 并 
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要求 渕 第 者 重 新 箱 入 。 





选 定 “提交 ”按钮 ， 选 择 菜单 栏 中 的 “窗口 ”一 “行为 ”命令 ， 将 打开 “ 行 
为 ”面板 。 单 击 “ 行 为 ”面板 中 的 “+” 按 钮 ， 从 弹出 的 行为 列表 中 选择 “检查 表单 ” 合 





令 ， 添 加 验证 表单 的 动作 ， 将 弹出 “检查 表单 ”对 话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 





e 设置 subject 文 本 域 的 验证 条 件 :“ 值 ”为 “必需 的 ””“ 可 接受 ” 选 “ 任 何 东 西 ”。 





@ 设置 author 文 本 域 的 验证 条 件 :“ 值 ”为 “必需 的 ”; 





“可 接受 ” 选 “ 任 何 东西 ”。 


e 设置 email 文 本 域 的 验证 条 件 :“ 值 ”为 “必需 的 “可 按 受 ” 选 “电子 好 件 地 址 ” 表 


示 必 须 输 入 电子 信箱 地 址 。 
该 动作 完成 后 的 设置 如 图 4-36 所 示 。 











mm 


- - 
input “subjec 
input "anthnr" 

1 1 [Ri = 











值 : 必需 的 


可 接受 局 性 何 东 西 中 数字 
② 电子 邮件 地 址 口 数字 从 | | 








图 4-36 设置 “检查 表单 ”动作 对 话 框 


设置 完成 后 ， 单 击 “ 确 定 ” 按 钮 ， 返 回 到 
“文档 ”窗口 。 在 对 应 的 “标签 检查 器 ”面板 中 设置 “ 行 
为 ”动作 的 触发 事件 为 onClick， 如 图 4-37 所 示 。 

接 下 来 应 该 在 数据 库 中 添加 一 条 用 户 记 录 ， 
把 这 些 合格 的 数据 添加 到 这 条 记录 的 相应 的 字段 中 去 。 选 
择 荣 单 栏 中 的 “窗口 ”一 “服务 器 行为 ”命令 ， 打 开 “ 服 
务 器 行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 弹出 




















的 菜单 中 选择 “插入 记录 ”命令 ， 将 打开 “插入 记录 ”对 


话 框 。 
在 该 对 话 框 中 进行 如 下 设置 : 





_ 
| 属性 | 行为 标签 nput» 


-= ST 
I 到 


| 
E li el 






























































图 4-37 设置“ 行为 ”的 触发 动作 


@ 从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 作 为 数据 源 连接 对 象 。 
@ 从 “插入 到 表格 ”下 拉 列 表 框 中 选择 Message 作 为 使 用 的 数据 库 表 对 象 。 
@ 在 “插入 后 ， 转 到 ”文本 框 中 设置 肥 言 添加 到 表 Message 后 ， 跳 转 到 ListMessage.asp 网 








页 。 


~ 








@ 该 对 话 框 的 下 半 部 分 用 于 将 网 页 中 的 表单 对 象 和 数据 库 中 表 Message 中 的 字段 一 一 对 


设置 完成 后 该 对 话 框 如 图 4-38 所 示 。 











插入 到 | 表格: message v 
插入 后 ， 转 到 : 浏览 


获取 值 自 : に 回 (在 提 变 时 ) 
表单 元 素 : tk st UL ドロ 3 _ (本) 


いい 
ema1 31 押入 名 軸 中 人 RC 区 本 ) 
contermt 插 六 划 列 中 ”content” (让 本 ) 








me 。 避 
提 交 丸文 本 v 











4-38 设置 完成 后 的 “插入 记录 ”对 话 杠 
说 明 : 
在 上 面 的 操作 中 ， 没 有 提供 添加 “发 言 时 间 ” 的 入 口 ， 这 是 因为 发 言 时 间 是 由 Access 
数据 库 根 据 记 录 被 保存 的 时 刻 自 行 计 算出 来 的 ， 这 主要 通过 指定 Message 表 的 DateTime 字 
段 的 默认 值 来 实现 。 


设置 完成 后 ， 单 击 “ 确 定 ” 投 钮 ， 完 成 该 页 和 的 制作 。 


开 咏 明史 列 留言 列表 


罗列 页 面 是 用 来 显示 所 有 的 留言 主题 列表 的 页 和 面 。 当 网 页 浏览 者 想 浏 览 留言 时 ， 可 以 单 
击 “ 查 看 留言 ”文本 链接 ， 从 而 打开 ListMessage.asp 页 面 浏 览 所 有 的 留言 。 

罗列 页 面 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 ListMessage.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “ 罗 
列 ”。 在 文档 中 修改 布局 效 末 ， 完 成 的 静态 页 面 效 末 如 网 4-39 所 示 。 


DW 文件 (7) 病人 改 G) 查看 7) 押入 ロ ) 请 充 侣 ) 格式 名 ) 合 補 WE) 站 点 (5 曽 口 W) 情動 OO | 一 
| ** 














ED ernessutr wu styie ess 
EE 
> つ 3 个 地址 

















图 4-39 ListMessage.asp 毅 态 页 面 设 计 
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选择 菜单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 面 板 ， 单 击 该 面板 中 
的 “+” 号 按钮 ， 从 弹出 的 菜单 中 选择 “记录 集 〈 碍 询 )” 命 令 ， 打 开 “ 记 录 集 ”对 话 框 。 在 
该 对 话 框 中 进行 如 下 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 rsMessage 作 为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 数 据 源 连接 对 象 。 
从 “表格 ”下 拉 列 表 杠 中， 选择 使 用 的 数据 库 表 对 象 为 message。 
在 “ 列 ” 选 项 组 中 先 选 择 “ 选 定 的 ” 单 选 按钮 ， 然 后 从 下 面 的 字段 列表 框 中 选择 
ID、subject、anthor 和 time 字 段 。 
@ 在 “排序 ” 栏 中 设置 “time” 字 段 的 内 容 对 记录 集中 的 记录 进行 “降序 ”排列 ， 也 

瓯 是 将 最 新 发 表 的 留言 内 容 排列 在 最 前 面 。 

完成 后 的 设置 如 图 4-40 所 示 。 






































名 称 所 で 
连接 : | coonmessage ーー 
表格 : 

列 : 〇 全 部 。 ② 选 定 的 : 








email 


content 
筛选 : 无 | := 
排序 














4-40 定义 “记录 集 ” 参 数 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 返 回 到 “文档 ”窗口 。 
将 Recordsetl 记录 集中 的 字段 绑 定 到 页 面 上 相应 的 位 置 ， 效 末 如 网 4-41 所 示 。 


DW 文 #f 的 必 0E) 論者 (Y) 手 入 (I) 博识 介 ) 格式 t0) 春分 多 ) 站 直人 5 間口 着 风 0M) | に | 





相声 | 村人 潮 | 过 if | 示 時 代 央 に イ 。 和 本 後田 」 給 査 に に 、 に 
© 分 ht 


Oooocoooococoocoocoocoooococoocoooccoocoocooocooooooooocooooooooocooooccooooocoococcoocoooocoooooooooccoococoocoocooooooooco 


き 一 HB mc 
We ir> Wi vani 12 Mi IT | i M 2 


| <> mw | 特 式 中) 无 “I 肝 ほ 紀 Mg 标题 0) | 
bh GS TO) lock ひつ HR 


CTE | 











< 
BB BHM: 2011-5-8 10:05 





4-41 绑 定 数据 











留言 板 系 统 


在 “文档 ”窗口 中 拖 忠 鼠标 选择 表格 的 第 2 行 。 单 击 “ 服 务 器 行为 ”面板 中 的 
加 号 “+” 按 钮 ， 从 弹出 的 下 拉 玉 单 中 选择 “重复 区 域 ” 命 令 ， 打 开 “ 重 复 区 域 ” 对 话 框 。 
在 “重复 区 域 ” 对 话 框 的 “记录 集 ” 下 拉 列 表 中 选择 rsMessage 记录 集 。 在 
”区 域 ， 设 置 在 一 rn is 8 条 记录 ， 如 图 4-42 所 示 。 
为 了 浏览 者 浏览 时 导航 方便 ， 还 需要 在 网 页 的 最 后 设置 一 个 动态 记录 导航 。 在 
该 文档 中 分 别 输入 “首页 入 “上 一 页 条 > “最 后 页 ”等 文本 字样 。 
通过 拖 电 岂 标 ， 选 中 “首页 ”文字 。 “服务 器 行为 ”面板 中 的 加 号 “十 
按钮 ， 从 弹出 的 下 拉 菜 单 中 选择 菜单 栏 “ 记 录 集 分 页 ”一 “ 移 至 第 一 条 记录 ”命令 ， 在 “ 移 至 
一 条 记录 ”对 话 框 中 的 “记录 和 集 ” F 拉 列表 框 中 选择 rsMessage 记录 集 ， 如 图 4-43 所 示 。 
































移 至 第 一 条 记录 


链接 名 "首页 


记录 集 ; 











4-42 “重复 区 域 ”对 话 框 4-43 设置 首页 的 链接 命令 





通过 同样 的 方法 为 “上 一 页 入 “下 一 页 和 “最 后 页 ”文本 字样 添加 相应 的 服务 
亏 行 为 ， 添 加 导航 栏 后 的 效 末 如 图 4-44 所 示 。 


Dw 文件 1] 答 必 GG) 毒舌 (Y) 手 入 (I) 塘 冯 人 格式 名 ) 命 を (C) 站 点 45? 曽 口 W) 靖 動 OO i 有 ” [|[ 王 语 司 





GIRD ene Siyle ess 
状 绩 | 措 雪 | @it | 天 村 代 張 に イ 。 全 交 補 田邊 本 人) に 、 


| 起 
人 va GD su hy |N の ho /和 WE GL) 


英 元 v B77 ほぼ び 数 
Y ひ の HR 
le 时 元 格 。 水 平 总 ) 取 入 Y 自如 不 暴行 彻 [| 表示 語 &)| ,| 
1 六 便意 ① i x 高 ⑪ 村 量 ) に | 











图 4-44 ”添加 导航 栏 





通过 拖 电 鼠 标 ， 选 中 “首页 ”文本 。 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+ 


按钮 ， 从 弹出 的 下 拉 菜 单 中 选择 染 单 栏 中 的 “显示 区 域 ” 一 “如 条 不 是 第 一 条 记录 则 显示 区 
域 ” 命 令 。 在 “如 末 不 是 第 一 条 记录 则 显示 区 域 ” 对 话 框 中 的 “记录 集 ” 下 拉 列 表 框 中 选择 


rsMessage 记录 集 ， 如 图 4-43 所 示 。 




















图 4-45 设置 显示 命令 


通过 同样 的 方法 为 “上 一 页 ”、 
务 帮 行为 。 设 症 显 示 和 隐 史 区域 后 的 效果 如 图 4-46 所 示 。 








“下 一 页 ”和 “最 后 页 文本 字样 添加 相应 的 服 
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4-46 ”设置 显示 和 隐藏 区 域 





接 下 来 还 需 
“现在 显示 的 是 第 メー 第 Y 条 记录 ， 共 有 NN 条 记录 ”， 


训 昌 村 蕊 此 条 上 媳 天 是 矛 


ET 一 
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要 制作 一 个 计数 器。 将 鼠标 指针 放 症 在 记录 表格 的 前 面 ， 输 入 文本 
如 图 4-47 所 示 。 
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4-47 制作 计数 需 
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留言 板 系 统 


用 鼠标 选中 “X”， 在 数据 “ 绑 定 ”面板 中 展开 rsMessage 记录 集 ， 选 择 [ 第 一 
个 记录 索引 ]， 然 后 单 击 “ 插 入 ”按钮 ， 则 “X” 字 样 被 {rsMessage frst! 占 位 符 代替 。 

在 “文档 ”窗口 中 选择 “Y” 有 字样。 在 数据 绑 定 面板 中 选择 [最 后 一 个 记录 过 
引 ]， 然 后 单 击 “ 插 入 ”按钮 ， 在 “文档 ”窗口 中 选择 “N” 了 字样 。 在 数据 绑 定 面板 中 选择 
[总 记录 数 ]， 然 后 单 击 “插入 ”按钮 。 

绑 定 后 ， 计 数 亏 中 的 文本 和 占 位 符 如 图 4-48 所 示 。 
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4-48 创建 计数 需 后 的 “文档 ”窗口 


还 需要 在 网 页 中 设置 一 个 链接 对 象 ， 使 浏览 者 能 够 转 到 /ShowMessage.asp 页 面 
中 和 查看 详细 的 留言 。 选 中 主题 下 的 frsMessage.subjecftj 作 为 链接 ， 然 后 单 击 “ 服 务 器 行为 ” 面 
板 中 的 加 号 “+” 按 钮 ， 从 弹出 的 下 拉 有 来 单 中 选择 “ 转 到 评 细 页 面 ” 命 令 ， 则 打开 “ 转 到 详 
细 页 ”对 话 框 。 

单 击 打开 “链接 ”下 拉 列 表 框 ， 从 中 选择 应 用 “ 转 到 详细 页 面 ”服务 器 行为 的 
链接 。 在 “详细 信息 页 ”文本 框 中 输入 细节 页 的 路 径 和 文件 名 /ShowMessage.asp。 在 “传递 
URL 参数 ”文本 框 中 输入 ID ， 表 示 通 知 该 文件 以 参数 ID 作为 用 户 传递 记录 的 依据 ， 服 务 器 
根据 ID 的 值 癌 用 户 传递 其 选 定 的 记录 。 打 开 “ 列 ”下 拉 列 表 框 ， 从 中 选择 传递 URL 参数 所 
对 应 的 字段 名 称 ID, 如 図 4-49 所 示 。 




















链接 : | 所 选 范围 : “<%= (rsMessage.Fis1, W 
详细 信息 页 : /Showhlessage. asp 


传递 URL 参数 : ID ”设置 为 以 下 项 的 值 


记录 集 rslesssee 着 























到 |: Im 图 
传递 现 有 参数 : | ] umr 参数 
[| 表单 参数 








4-49 “ 转 到 详细 页 面 ” 对 话 框 设 置 
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选择 菜单 栏 中 的 “文件 ”一 “保存 ”命令 ， 你 存 修改 后 的 文档 即 完 成 本 页 面 的 
制作 。 








显示 现 有 留言 的 详细 内 容 主 要 是 在 ShowMessage.asp 页 面 中 实现 的 ， 单 击 罗列 页 后 链接 
到 该 页 面 中 ， 并 显示 详细 的 留言 信息 。 

制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 ShowMessage.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 
“显示 ” 在 文档 中 修改 布局 效果 ， 完 成 后 的 静态 页 面 效 果 如 图 4-50 所 示 。 其 中 “返回 留言 
列表 ”链接 的 是 ListMessage.asp 页 面 。 
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4-50 ShowMessage.asp 静态 页 面议 计 





选择 沫 单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 面 板 ， 单 击 该 面 
板 中 的 加 号 “+” 按 钮 ， 从 弹出 的 染 单 中 选择 “记录 集 (查询 )” 人 命令， 将 打开 “记录 集 ” 
对 话 框 。 

在 该 对 话 框 中 进行 如 下 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 rsMessage 作 为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 数 据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 杠 中， 选择 使 用 的 数据 库 表 对 象 为 message。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

设置 完成 后 的 “记录 和 集 ” 对 话 框 如 图 4-51 所 示 。 





























の 1 留言 板 系统 


名 称 : 
RE 
表格 :oossee 。 

列 :① 全 部 〇 选 定 的 : 


URL 参数 | | 
7 li 








4-51 定义 记录 集 rsMessage 


设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 。 将 rsMessage 
记录 集中 的 字段 绑 定 到 页 面 中 相应 的 位 置 上 ， 完 成 后 的 效果 如 图 4-52 所 示 。 
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图 4-52” 绑 定 记 录 和 集 





选择 菜单 栏 中 的 “文件 ”一 “你 存 ”命令 ， 将 修改 后 的 文档 保存 。 


_ Section 


プ ェ た * ヽ 
后 全 常理 功 能 设计 
留言 板 还 需要 设计 一 个 后 台 管理 功能 ， 方 便 网 站 所 有 者 对 留言 板 的 管理 和 控制 。 这 就 需 


要 制作 登录 后 台 管 理 的 页 面 Admin.asp， 还 有 选择 删除 多 余 留 言 的 页 面 DeleteMessage.asp 及 
删除 的 页 面 Deleteok.asp。 
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“设计 后 台 省 理 登录 页 面 


Admin.asp 是 用 于 后 台 登 录 的 页 面 ， 页 面 比较 人 简单， 需要 用 户 名 及 密码 两 个 动态 对 象 及 
提交 表单 功能 按钮 。 

制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 Admin.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “后 台 管 
理 ” 在 文档 中 修改 布局 效果 ， 人 完成 后 的 静态 页 面 效果 如 图 4-53 所 示 。 
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RRNA LT IE な な で 1 
TET 


aa cut ャ | 時 本間 "| 
EE EE S| 
LB- - | | 監 | 二 ,本 

















[bay tdhvmei dh CHiwWhooki formy tpy LE 


me | 梧 式 人 | 自 东 ~ 
县 


而 本 元 = 了 且 注 二 赴 各 是 站 
還 1 HD 目標 @ 


号 in) | 天 








I CE 
图 4-53 制作 的 静态 页 面 效 果 
由 于 输入 用 户 名 及 密码 后 需要 与 数据 库 Admin.mdb 中 的 用 户 名 及 密码 核对 ， 
设置 “用 户 名 ”和 “密码 ”后 面 的 文本 域名 称 分 别 为 admin 和 password, 如 較 4-54 所 示 。 
| 


区 文本 域 字符 宽度 | | 关 型 〇 単行 ) 〇 多 行 ⑪  O 〇 密友) 
最 多 字符 数 | 初始 值 CJ 9 








禁 用 Q) 
口 只 读 @&) 
SHE 
文本 域 字符 宽度 由 | | 类 型 中 单行 G) 〇 多 行 ⑪ 。 〇 密码 @) ② 
最 多 字符 数 | | 初 始 値 ) | ||? 
器] 禁用 四 ) 
口 只 读 色 ) 





4-54 定 叉 文 本 域名 称 


用 户 可 以 通过 该 网 页 中 表单 的 提交 实现 登录 功能 。 选 择 沫 单 栏 中 的 “窗口 ”一 




















“服务 需 行 为 ”命令 ， 打 开 “ 服 务 融 行为 ”面板 。 单 击 该 面板 中 的 加 “+” 瑟 按钮， 从 打开 的 
某 单 中 选择 “用 户 身 份 验证 ”一 “登录 用 户 ” 命 令 ， 如 网 4-55 所 示 ， 同 该 网 页 中 添加 登录 


用 户 的 服务 左 行 为 。 
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4-55 添加 “登录 用 户 ” 的 服务 器 行为 





打开 如 图 4-56 所 示 的 “登录 用 户 ” 对 话 框 ， 该 对 话 框 的 第 一 部 分 用 来 设置 表 





単 中 的 文 本 域 的 功能 。 


具体 设置 如 下 : 





@ 从 “从 表单 获取 输入 ”下 拉 沫 单 中 选择 该 服务 闫 行为 使 用 网 页 中 的 forml 表单 对 象 中 
浏览 者 填写 的 对 象 。 
@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 Admin 对 象 ， 设 定 该 用 户 登 录 服 务 天 行 为 
的 用 户 名 数据 来 源 为 表单 的 Admin 文 本 域 中 浏览 者 输入 的 内 容 。 




















的 用 户 名 数据 来 源 为 表单 的 password 文 本 域 中 浏览 者 输入 的 内 容 。 


CONNo 


Admin。 











从 6 表格 ?2? 


从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 该 用 户 登 录 服 务 器 行为 


从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 颖 行为 使 用 的 数据 源 连 接 对 象 为 


下 拉 列 表 中 选择 该 用 户 登 录 服 务 右 行为 使 用 到 的 数据 库 表 对 象 为 








从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 Admin 存 储 用 户 名 的 字段 为 Admin 字 段 。 
从 “密码 列 ” 下 拉 列 表 中 选择 表 Admin 存 储 用 户 密 人 码 的 字段 为 Password 字 上段 。 


在 “如 采 登 录 成 功 ， 转 到 ”》 











文本 框 中 输入 登录 成 功 后 ， 转 癌 DeleteMessage.asp 页 面 。 


し 】 
@ 
@ 
@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 问 Admin.asp 页 面 。 
其 


《他 参数 你 持 默 认 值 ， 设 置 后 的 “登录 用 户 ” 对 话 框 如 图 4-56 所 示 。 


G9) 议 间 


完成 后 ， 单 击 “ 确 定 ” 鬼 钮 ， 


完成 登录 页 和 面 的 制作 ， 此 时 的 “服务 右 行 





为 ”面板 如 图 4- 





57 所 示 。 


从 表单 获 职 输入 : Form1 


用 户 名 字段 : 

密码 字段 : 

使 用 连接 验证 : 

表格 : 

用 户 名 列 |: 

密码 列 : 

如 果 登 录 成 功 ， 转 到 |: 


如 果 登 录 失 败 ， 转 到 |: 
基于 以 下 项 限制 访问 : 


4-56 








admin 











password 








coon 











hdmin 








Admin 








Password 











DeleteMessage. asp 














[| 转 到 前 一 个 URL( 如 果 它 存在 ) 





C 用户 名 、 客 码 和 访问 级 别 
获取 级 别 自 : I 














“登录 用 户 ” 对 话 杠 


リク 制作 删除 留言 页 面 | 
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| 再生 


十 一 苹 档 汪 型 : hSP VWEScript 





4-57 设置 后 的 “服务 需 行 为 ”面板 


登录 成 功 后 进入 DeleteMessage.asp 负面， 此 页 面 和 前 面 制 作 的 ListMessage.asp 页 面 不 











同 的 地 方 就 是 单 击 想 要 删除 的 留言 主题 ， 将 进入 Deleteok.asp 删除 的 页 面 。 


DeleteMessage.asp 页 面 的 制作 步骤 如 下 : 





在 Dreamweaver CSS 中 双击 “文件 ”面板 中 已 经 制作 好 的 ListMessage.asp 页 
面 ， 然 后 再 选择 菜单 栏 中 的 “文件 ”一 “另存 为 ”命令 ， 打 开 “ 另 存 为 ”对 话 框 ， 在 “文件 





名 ”文本 框 中 输入 DeleteMessage.asp， 如 图 4-58 所 示 。 








保存 在 这) : 回 chap04 
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EEE 





・ 

















4-S8 “另存 文件 为 DeleteMessage.asp 








第 4 童 @EL EA 





单 击 “ 人 保存” 按钮 ， 完 成 复制 页 面 的 操作 。 输 入 新 文字 “请 单 击 选择 要 删除 的 
留言 ， 进 入 删除 页 面 ?， 完 成 后 的 效 末 如 图 4-59 所 示 。 

接 下 来 修改 该 页 向 ， 单 击 留 言 的 主题 可 以 进入 Deleteok.asp 负面， 双击“ 服务 
器 行为 ”面板 中 的 “ 转 到 详细 页 面 ” 行 为 ， 如 网 4-60 所 示 。 














十 一 辫 档 类 型 : hsP VESeript 


记录 集 rsMessagel 

中 rsMessage. Eirst record) 
动 意 女 本 [rsMessaee. last racnrdd]l 
动态 站 本 rsMessage. total record) 
重复 区 域 (rsMessage) 
| 评 纳 万 抽 | 

中 rsMassaga. stnbjeet] 

动态 总 本 [rsMessaee. author) 
动容 人 本 rsMessage. time】 

如 果 十 是 第 一 条 记录 则 显示 rsMes... 
迄 至 第 一 条 记录 (YsNessage) 

如 果 记 录 集 趟 尘 空 则 显示 rsMessage) 
稼 至 前 一 和 记录 性 sNessage) 

如果 记录 集 涉 汶 宝 则 显示 rsMessage】 
乏 圣 下 一 条 记录 rsMessage】 

如 果 涉 是 最 后 一 条 记录 则 显示 fro... 
乏 动 到 最 后 一 条 记录 rsMessage】 
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冰 夏 上 一 臣 下 一 覧 量 几 页 
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图 4-59 修改 后 的 页 面 效果 图 4-60 选择 “ 转 到 详细 页 面 ” 服 务 需 行为 


打开 “ 转 到 详细 页 面 ” 对 话 框 。 在 “详细 信息 页 ”文本 框 中 输入 要 转 入 的 新 页 
面 /Deleteok.asp, 如 関 4-61 所 示 。 





链接 : 
详细 信息 页 : |/Deleteok. asp | 


传递 URL 参 数 : 设置 为 以 下 项 的 值 
记录 集 : | snessage v 














列 : Tn v| 
传递 现 有 参数 : [ ] URL 参数 
し | 表单 参数 








图 4-61 修改 转 入 的 细节 页 地 址 


单 击 “ 确 定 ” 按 钮 ， 则 完成 DeleteMessage.asp 的 制作 。 


2 时 删除 成 功 页 面 的 制作 | 


这 个 页 面 是 真正 实现 留言 删除 的 页 面 ， 主 要 应 用 “服务 右 行 为 ”和 面板 中 的 “删除 记录 
命令 。 此 页 面 同 前 面 制 作 的 ShowMessage.asp 页 面 不 同 的 地 方 是 需要 插入 一 个 表单 和 一 个 删 
除 按钮 ， 因 为 提交 删除 命令 时 需要 把 所 有 的 数据 传 到 数据 库 中 。 

Deleteok.asp 页 面 的 制作 步骤 如 下 : 

将 制作 的 moban.asp 另存 为 Deleteok.asp 页 面 ， 并 在 网 页 标题 栏 中 输入 “后 从 
管理 ?”。 在 文档 中 修改 布局 效 末 ， 完 成 后 的 静态 页 面 效果 如 网 4-62 所 示 。 
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に TET 呈 | 
ER 


选择 采 单 栏 中 的 “窗口 ”一 “ 绑 定 ”命令 ， 打 开 “ 绑 定 ” 和 面板 ， 单 击 该 
面板 中 的 加 “+” 扎 按钮 ， 从 弹出 的 菜单 中 选择 “记录 集 ( 碍 询 )” 命 令 ， 将 打开 “记录 


集 ” 対策 椎 。 
在 该 对 话 框 中 进行 如 下 设置 














在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 


ID 值 进行 UREL 参 数 的 传递 ， 如 图 4-63 所 示 。 


5 Eee 。。==。。 | 
Tr ll 再 コ 
© 


列 : で ) 全 部 稀 定 的 : 


下 


4-63 ”定义 记录 集 





在 “名 称 ” 文 本 框 中 输入 rsMessage 作 为 该 记录 集 的 名 称 。 
从 “连接 ”下 拉 列 表 框 中 选择 coonmessage 数 据 源 连接 对 象 。 
从 “表格 ”下 拉 列 表 框 中 ， 选 择 使 用 的 数据 库 表 对 象 为 message。 





在 “ 科 选 ” 栏 中 设置 记录 集 过 滤 的 条 件 为 ID、=、URL 参 数 、ID， 意 思 是 由 指定 的 











留言 板 系 统 





设置 完成 后 ， 单 击 该 对 话 框 中 的 “确定 ”按钮 ， 关 闭 该 对 话 框 。 返 回 到 “ 文 
档 ”窗口 。 

将 rsMessage 记录 集中 的 字段 绑 定 到 页 面 中 相应 的 位 置 上 ， 完 成 的 效果 如 图 4-64 
所 示 。 
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图 4-64 ” 绑 定 记录 和 集 


单 击 “服务 堪 行 为 ”面板 中 的 加 号 “+” 按 钮 ， 从 打开 的 染 单 中 选择 “删除 记 
孙 ” 命 令 ， 添 加 删除 记录 的 服务 器 行为 。 打 开 如 网 4-65 所 示 的 “删除 记录 ”对 话 框 ， 该 对 
话 框 中 的 第 一 部 分 用 来 设置 表单 中 的 文本 域 的 功能 。 
进行 如 下 设置 : 
从 “连接 ”下 拉 列 表 中 选择 coonmessage 作 为 数据 源 连 接 对 象 。 
从 “从 表格 中 删除 ”下 拉 列 表 中 选择 message 作 为 使 用 的 数据 库 表 对 象 ， 即 存储 讨论 
主题 的 表 对 象 。 
@ 从 “选取 记录 自 ” 下 拉 列 表 中 选择 rsMessage 记 录 集 作为 要 删除 的 记录 对 人 象 。 
@ 在 “唯一 键 列 ”下 拉 列 表 中 选择 主键 字段 为 ID。 
@ 从 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 forml 。 
@ 在 “删除 后 ， 转 到 ” 栏 中 设置 记录 成 功 删 除 后 ， 切 换 到 /index.asp 网 页 。 
其 他 参数 保持 默认 值 ， 设 置 后 的 面板 如 图 4-65 所 示 。 























连接 : coomnmessage 
从 表格 中 册 除 : 
选 职 记 录 自 : rsilessage 











唯一 键 列 : マ | 四 数值 
提 变 此 表单 以 删除 : | forml wv | 
删除 后 ， 转 到 : |/index.asp | 























4-65 添加 “删除 记录 ”的 服务 右 行 为 
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单 击 “ 确 定 ” 按 钮 ， 完 成 删除 记录 行为 设置 ， 选 择 采 单位 中 的 “文件 ”一 “你 
存 ” 命 令 ， 将 文档 你 存 。 


4.5 留言 板 系 统 测 试 


留言 板 的 测试 及 优化 很 重要 ， 通 过 在 浏览 器 中 进行 测试 留言 板 的 执行 效果 可 以 合 找 出 该 
留言 板 系 统 的 不 足 之 处 ， mr 


2 于 留言 功能 测试 
测试 的 步 又 如 下 : 
首先 在 message.mdb 数据 库 中 输入 一 些 用 于 测试 的 数据 。 然 后 打开 正 浏览 


， 在 地 址 栏 中 输入 http://127.0.0.1， 打 开 index.asp 文件 , 如 較 4-66 所 示 。 在 该 页 面 中 单 击 
Pe 文本 ， 跳 转 到 InsertMessage.asp 页 面 。 
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4-66 EnterMessage.htm 页 面 


在 InsertMessage.asp 页 面 中 ， 按 如 图 4-67 所 示 ， 输 入 留言 内 容 。 
输入 留言 内 容 后 ， 单 击 “ 提 交 ” 按 钮 ， 浏 览 器 将 目 动 跳 转 到 ListMessage.asp 
页 面 ， 显 示 当 前 数据 库 中 已 有 的 留言 列表 ， 如 图 4-68 所 示 。 

















汉 攻关 页 - Nicrosoft Internet Explorer 加 回国 
: 文件 到 ) ”编辑 正 ) 查看 ”收藏 自 ) 工具 て) 娠 助 ⑪ 和 


Om OO- 国 還 人 の 時 之 we の 回 ・ 因 暫 ・ 


1 地 址 部 ) 劉 http://127.0.0. 1/InsertNessage. asp 





マ | 回 5 到 





a 
主页 | 注册 | 登录 


后 台 管 理 





: 留言 测试 | 
: 洋吉 者 | 


: test@test. com 


这 是 用 来 误 试用 的 留言 | 
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图 4-67 填写 留言 板 


当 罗列 一 Nicrosoft Internet Explorer 
: 文件 下) 编辑 于) 查看 收藏 入 工具 JT) 帮助 册 ) 


Om © 回 回 QP mr OC SE DS 


: 地 址 J) 图 http://127.0.0.1/ListMessage. asp 


ong? 





マ 








从 
主页 | 注册 | 登录 


现在 显示 的 是 第 1- 第 3 条 记录 ， 共有 3 条 记录 


a | wmasss 
| ww | | a 
上 一 页 下 一 页 


联系 电话 : 010-123456 ”传真 : 010-123456 


| 
办 Internet 








图 4-68 显示 留言 列表 


单 击 ListMessage.asp 页 面 中 留言 主题 文字 上 提供 的 链接 对 象 ， 跳 转 到 
ShowMessage.asp 页 面 查 看 留言 的 详细 内 容 ， 如 图 4-69 所 示 它 所 链接 的 是 第 一 条 信息 ， 要 解 
决 这 个 问题 ， 需 要 对 罗列 页 单 击 选择 “主题 ”后 的 值 传 给 显示 页 面 并 显示 相关 的 内 容 。 

这 里 打开 ShowMessage.asp 由 面 进行 进一步 完善 ， 双 击 服 务 占 行为 中 建立 的 
rsMessage 记录 集 ， 在 弹出 的 对 框 中 进行 修改 ， 由 于 设置 了 ID 值 是 目 动 生 成 的 唯一 键 
值 ， 可 以 饶 选 ID、=、URL 参数 、ID 值 ， 即 由 指定 的 ID 值 进 行 URL 参数 的 传递 ， 修 改 
如 图 4-70 所 示 。 
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ernet Explorer 
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图 4-69 出错 显示 的 信息 
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连接 : Coormessaege v 
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列 : で 全 部 〇 选 定 的 : 
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图 4-70 ”修改 筛选 值 





在 ShowMessage.asp 页 面 中 ， 能 够 显示 出 发 言 人 的 E-mail 地 址 。 但 是 ， 现 在 的 
网 页 中 显示 的 还 是 纯 文 本 型 的 E-mail 地 址 ， 还 应 该 创建 E-mail 链接 ， 使 浏览 者 单 击 该 地 址 


能 够 直接 弹出 默认 的 邮件 编辑 软件 ， 给 该 留言 人 发 邮件 。 
单 击 选中 {rsMessage.email} 字 段 ， 然 后 在 对 应 的 属性 设置 面板 中 的 “连接 ” 文 


本 框 中 输入 邮件 链接 地 址 mailto: <%=(rsMessage.Fields.Item("email").Value)%>， 如 图 4-71 


所 示 。 
nt = 
2 だ : ょ = 


|mr | 本 四 
CSS In I) 链接 站 EE i 

国 単元 格 求 平 默 认 ”~v| 宽 | | 不 換 行 [] 背景 
一 口 放 和 外 黑 V 選 高 | 細口 


4-71 创建 邮件 链接 
































编辑 完成 后 ， 将 网 页 保存 。 可 以 进行 测试 。 单 击 该 邮件 链接 对 象 ， 应 月 动 默 认 
的 邮件 编辑 软件 ， 如 Outlook 等 ， 供 浏览 者 或 留言 人 发 信 。 


4.5.2 








接 下 来 测试 后 人 台 管 理 部 分 ， 测 试 的 步骤 如 下 : 
打开 正 浏 览 器 ， 在 地 址 栏 中 输入 http:/127.0.0.1， 打 开 index.asp 文件 ， 在 该 页 
面 中 单 击 “ 后 台 管 理 ” 文 本 ， 跳 转 到 Admin.asp 页 面 ， 如 网 4-72 所 示 。 


ES 后 台 管 理 - Nicrosoft Internet Explorer 加 回国 
: 文件 \) 编辑 到) 查看 WD 收藏 入 工具 で) 帮助 


Om OO 図 国人 ぬ ぬ の 時 補 we の 回 ・ 縛 橋 


;地址 0) | 緒 ] http://12T.0.0.1/Admin. ssp 














へ 


主页 | 注册 | 登录 | 网 站 地 图 | 收藏 本 站 


后 台 管理 关于 我 们 


留言 板 后 台 登 录 管 理 
用 户 : |adnin 
密码: |adnin| 
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图 4-72 打开 后 全 登录 页 面 








在 “用 户 ” 文 本 框 中 输入 admin， 在 “密码 ”文本 框 中 输入 admin， 然 后 单 击 
“人 确定” 按钮， 进入 DeleteMessage.asp， 如 图 4-73 所 示 。 


3 - Nicrosoft Internet Explorer 加 回国 
: 文件 字 ) 编辑 代 ) 查看 如 ”收藏 上 工具 G) 和希 助 ⑪) 


Om OO EEO PD 丈 we 因 包 -和合 E 


; 地 址 ⑪) | http://127.0.0. 1/DeleteMessage. asp 














请 单 击 选择 要 册 除 的 留言 ， 进 入 册 除 页 面 


现在 显示 的 是 第 1- 第 3 条 记录 ， 共有 3 条 记录 


0 *m | sm | amm 
| www | … | meesss 
| ww | < | meewms 








4-73 打开 的 DeleteMessage.asp 负面 





这 里 选择 页 面 中 的 “留言 测试 ”主题 ， 打 开 相 关 留 言 的 Deleteok.asp 页 面 ， 如 








一 和 
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图 4-74 所 示 。 


ES 后 台 管理 - Nicrosoft Internet Explorer 
: 文件 W) 编辑 偿 ) 査 者 V) 収 療 ぬ ) 工具 で ) 希 助 ⑪) 


mm・ の 6 回 の 時 裕 we の 回 ・ 移 暫 ・ 


; 地 址 J) 图 http://127.0.0. 1/Deleteok. asp?ID=8 


ang? 








单 击 删除 按钮 删除 该 留言 
留言 主题 : 留言 测试 

言 者 : 出 記 者 

留言 日 期 : 2008-8-22 15:18:11 
联系 信箱 : test@test. com 

内 ” 容 : 这 是 用 来 测试 的 留 
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多 Internet 





4-74 打开 要 删除 的 Deleteok.asp 页 面 


单 击 页 面 中 的 “删除 ”按钮 ， 如 果 删 除 该 记录 ， 并 返回 留言 板 的 首页 index.asp 
页 面 ， 则 说 明 后 合 管理 系统 没有 错误 ， 测 斌 成功。 全 此 ， 整 个 留言 系统 融 设 计 开 发 完成 了 。 














] SH HHHH 


狐 闻 系统 是 动态 网 站 建设 中 经 常用 


到 的 系统 ， 尤 其 在 政府 单位 网 站 、 教 育 
单位 网 站 或 企业 网 站 中 更 是 如 此 。 新 闻 
系统 的 作用 是 在 网 上 传播 信息 ， 通 过 对 
新 闻 的 不 断 更 新 ， 让 用 户 及 时 了 解 行业 
言 息 、 企 业 状 况 。 新 闻 系 统 中 涉及 的 主 
要 操作 是 访问 者 的 新 闻 查 询 功 能 ， 和 系 
统管 理 员 对 新 闻 的 新 增 、 修 改 、 删 除 等 
功能 ， 制 作 相 对 比较 简单 。 
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搭建 新 闻 系 统 开发 平台 に 
新 闻 系 统 规划 に 

新 闻 系 统 功 能 页 面 に 

后 台 管理 に 
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业 搭 建新 闻 系统 开发 平台 


本 草 实 例 是 一 个 市 狐 闻 系统 的 “ 欧 雅 丽 ” 关 容 产 品 网 站 。 从 动态 功能 来 说 ， 主 要 介绍 如 
何 建 立 一 个 功能 完整 的 新 闻 系 统 ， 主 要 包括 新 增 、 修 改 、 删 除数 据 库 的 独 闻 记录 ， 站 页 设 计 
的 效 末 如 图 5-1 所 示 。 





























ma = Ea = 加 = 
| 六 全 FF 坊 针 下) 本 人 刀 屋 4) 六角 縛 和 Ti 本 VI 暫 ロ OW WB 
| B= 下記 | 这 口 重 孚 要 搞 青 作 | 記 3m 貼 引当 | 等 等 土 革 同 抽 | 号 


| | TP 
| 主讲: OR 可 sd 
"= = = 于 
ww = 一 
『 一 巨 品 莹 往 


美丽 与 自信 并 和 入 | 
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5-1 设计 的 站 页 效果 


本 实例 是 一 个 经 典 的 新 闻 系 统 网 页 。 需 要 按 一 般 的 步骤 进行 Photoshop CS5 分 割 图 片 ， 
建立 本 实例 的 站 点 chap05, 配 連 IIS 站 点 浏览 ， 使 用 div+CSS 布局 静态 页 面 儿 个 环节 。 


月 胃 使用 Photoshop CS5 分 割 图 片 





用 Photoshop CSS 切 族 工具 分 割 首 页 图 乒 ， 其 体 步 又 如 下 : 

在 本 地 D 盘 下 建立 站 点 文件 夹 Chap05， 建 立 一 些 常 用 的 文件 夹 。 启 动 
Photoshop CS5， 选 择 菜 单 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开光 盘 中 所 做 的 首页 平面 效果 
index.psd 文件 ， 如 图 5-1 所 示 。 

首先 切割 最 上 面 的 “ 欧 雅 丽 ” 标 题 ihdex.psd 年 102%% (主要 , RGBY 
行 的 图 片 ， 单 击 工具 箱 中 的 “切片 工具 ”按钮 [区 = 王 際 
为 ， 从 场景 的 左上 角 拖 电 到 标题 的 右 下 角 ， 如 
图 $-2 所 示 ， 图 中 绘制 的 虚线 框 就 是 切片 大 小 ， 
切片 后 左上 角 将 显示 国 图 图 标 。 

接 下 来 分 割 其 他 图 片 部 分 。 保 持 
“切片 工具 ”按钮 | 蜀 选 中 状态 ， 按 下 《Ctrl+ ーー 
H) 组 合 键 ， 打 开 辅 助 线 视 图 ， 可 以 先 用 辅助 线 图 5 2 Logo 部 分 的 切片 至 灯 






























分 割 好 需要 分 割 的 区 域 ， 按 照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 9 个 小 图 片 ， 如 图 5-3 
所 示 。 
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图 5-3 ”切片 整个 首页 的 效果 





选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打开“ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “が 散 ” 模式 , 
“ 仿 色 ” 值 为 100%， 其 他 设置 如 图 5-4 所 示 。 


下 人 而 Webh 和 遇 看 师 妥 梅生 和 奋 全 了 
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图 5-4 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


蛙 击 “存储 ”按钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 选择 “保存 
在 ”后 面 的 下 拉 三 角 按 钮 六 ， 选 择 建 立 的 chap05 文件 夹 ， 其 他 参数 保持 默认 值 ， 设 置 如 图 
5-5 所 示 。 


新 闻 系 统 











ン Dreamnvweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


将 优化 铺 果 存储 为 


保存 在 QD) し つ has 





图 5-5 “将 优化 结果 存储 为 ”对 话 框 设置 


单 击 “你 存 ” 按 钮 ， 完 成 保存 切片 的 操作 。 打 开 你 存 文件 的 路 径 ， 可 以 看 到 目 
动 生成 了 一 个 images 的 文件 来 ， 文 件 夹 里 是 再 面 分 割 后 产生 的 小 图 片 ， 由 这 些小 图 片 组 成 
了 和 页 的 效果 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 5-6 所 示 。 
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$-6 分割 后 的 小 图 片 


引 配置 新 闻 系统 站 点 服务 器 





接 下 来 使 用 IS 在 本 地 计算 机 上 创建 新 闻 系 统 的 站 点 ， 配 置 步骤 如 下 : 

首先 启动 IS, 在 IS 窗口 中 ， 右 键 单 击 “ 默 认 网 站 ”选择 菜单 中 的 “属性 ” 
命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 5-7 所 示 。 

单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 新 闻 站 点 文件 夹 路 
径 为 “D:chap05”， 其 他 参数 保持 默认 值 ， 议 置 如 图 $-8 所 示 。 


























网 站 | TSAPT 筛选 器 | 主 目录 | 文档 “ ‖ 目录 安全 性 | TTF 头 | 自 定义 错误 网 站 


ISAFI 往 选 器 | 主 目录 
网 站 标识 


连接 到 资源 时 的 内 容 来 源 : 





描述 (8): ER Pl | ©⑤ 此 计算 机 上 的 目录 ①) 





ー ム 共享 
"MO 。 | 全 3 om mw 
TCF 端 口 ①): ssL 端 口 

本 地 路 径 (C): D: AehapD8 
连接 


中 脚本 资源 访问 闻 ) 记录 访问 0 
连接 超时 (8) : b 4 (ER) 索引 資源 ) 
写 入 他) 
保持 HTTF 连接 台 ) 口 目录 训 览 @) 
启用 日 志 记 录 ) 应 用 程序 设置 


活动 日 志 格 式 ⑰: 应 用 程序 名 W) : 默认 应 用 程序 | [删除 外) | 
W3C 扩展 日 志文 件 格式 | | 尾 性 Eg). 开始 位 置 : 人 默认 网 站 》 


| 配置 .| 
执行 权限 ): 征服 まま 本 
应 用 程序 保护 (WD): 中 典 用 vv 生 坊 碟 ) 















































5-7 “默认 网 站 属性 ”对 话 框 5-8 ”设置 网 站 的 “本 地 路 径 ” 


单 击 “确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 配置 ， 由 于 前 和 耐 已 经 使 用 
Photoshop CS5 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 TE 浏览 器 输入 地 
址 http://127.0.0.1， 即 可 打开 页 和 面 分 割 后 的 效果 ， 如 图 $-9 所 示 。 
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图 5-9 浏览 的 最 初 效 果 


当 可 以 浏览 到 Photoshop CSS 分 割 后 的 网 页 效果 时 ， 说 明 站 点 服务 占 的 配置 已 经 完成 ， 
束 可 以 开始 下 一 步 制 作 了 。 

















使用 Dreamweaver CS5 进行 网 页 布局 设计 时 ， 首 先 需 要 使 用 定义 站 点 问 导 定义 站 点 ， 操 


作 步 骤 如 下 : 
打开 Dreamweaver CS5， 选 择 菜 单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 


る 
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“管理 站 点 ”对 话 框 。 

单 击 右边 的 “新 建 ” 按 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ”对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ” chap05。 

“本 地 站 点 文件 夹 ” D:hap0S\。 

如 图 5-10 所 示 。 


站 点 设置 对 锣 chap05 





一 | Dreamweaver : 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweayver 
站 点 通常 包含 两 个 部 分 : 可 在 其 中 存 情 和 处 理 文 件 的 计算 机 上 的 本 地 文件 
版 本 控制 夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 到 Web 上 的 服务 器 上 的 远程 文件 去。 


”高 级 设置 





您 可 以 在 此 处 汶 Dreamweaver 站 点 选择 本 地 立 件 夹 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 夹 : = 





图 5-10 ”设置 站 点 对 话 框 


单 击 “ 分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 
“服务 器 名 称 ” chap05。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ” D:\chap0S\。 

“ Web URL”: http://127.0.0.1。 

配置 后 的 “测试 服务 器 ”的 参数 设置 如 图 5-11 所 示 。 


站 点 设置 对 旬 chap05 








服务 器 名 称 : 
ほか 
有人:[Achsp05 ”| 名 

















图 5-11 “服务 占 ” 选 项 卡 的 参数 设 管 
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单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 这 样 ， 在 Dreamweaver CSS 中 就 已 
经 拥有 了 刚才 所 设置 的 站 点 了 。 


使 用 div+CSS 布 局 网 页 ) ②③) 


整体 的 页 面 布局 规划 设计 ， 如 图 5-12 所 示 。 
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图 5-12 整体 布局 框架 设计 


使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 XHTML 1.0 文档 
格式 ， 将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


<IDOCTYPE html PUBLIC "-/W3C/DID XHTML 1.0 Transitional//EN" "http://www.w3. 
org/TR/xhtml1/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 


<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 





<link rel="stylesheet" href="css/style.css" type="text/css" /> 
<title> 新 闻 系 统 </title> 
</head> 


其 他 div 的 布局 代码 如 下 : 
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<body> 
<div id="top "> 
<div 1d="logo"></div> 
<div id="tupian1 "></div> 
</div> 
<div id="mid"> 
<div id="daohang"> 
<div class="wenzi"><a hre 仁 "#"> 网 站 首页 </a></div> 
<div class="wenzi"><a hre 仁 "#"> 产 品 资讯 </a></div> 
<div class="wenzi"><a hre 伍 "#"> 美 丽 护 理 </a></div> 
<div class="wenzi"><a hre 仁 "張ら 新聞 中 心 a><7div> 
<div class="wenzi"><a hre 仁 "#"> 联 系 我 们 </a></div> 
</div> 
<div id="banner"></div> 
<div 1d="tuplan2"></div> 
<div 1d="lianjie"></div> 
<div 1d="biaoti"><img src="/images/index 07.jpg" /></div> 
<div id="word"> 
<div class="neirong"> 
<p><a href="#'"> 公 司 高 层 深入 市 场 一 线 考察 ..。 ”2008-06-02</a></p> 











<p><a hre 伍 "#"> 欧 雅 丽 5 周年 庆 系 列 活动 … 2008-05-25</a></p> 
<p><a hre 伍 "#"> 欧 雅 丽 参 加 上 海 美博 会 ..… 2008-05-23</a></p> 
<p><a hre 伍 "#"> 欧 雅 丽 参加 北京 美博 会 .… 2008-04-23</a></p> 
<p><a hre 伟 "#"> 欧 雅 丽 参加 广州 美博 会 … 2008-03-23</a></p> 

</div> 

</div> 

</div> 


<div id="bottom"> 
<div id="bot"></div> 
</div> 

</body> 

</html> 


在 站 点 中 建立 css 文件 来， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


* 整 体内 面 CSS*/ 
*{ margin:Opx; 





padding:Opx: 
} 
な 控 制 整体 を 
body{ width: 100%; 
height: 100%; 
font:12px "宋体 ", Helvetica, sans-serif 
background:#FFF; 
} 
な 设置 所 有 图 片 的 边框 为 0 
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Img { 
border:0: 
} 
/* 设置 最 外 层 居中 显示 ， 实 现 让 整个 页 面 居中 显示 z 
#top,#mid,#bottom { > 
margin: auto; 
width:840px; 
} 
な 设置 左 浮 动 的 标签 */ 
#logo,#tupian 1,#daohang,#banner,#tupian2,#lianjie,#b1iaoti,#word,#bot{ 
float:left: 
} 
p{ line-height:1.9; 
} 
な 页 面 链 接 */ 
a:link { 
color: #SF9406: 
text-decoration: none: 


} 


a:visited { 

















text-decoration: none: 
color:#62b400: 
) 
a:hover { 
text-decoration: underhne: 
color#FFB11S: 
) 
a:actiVe { 
text-decoration: none; 
color:#ffe30b: 
} 
/*top 部 分 */ 
#logo{ 
width:154px: 
height:96px: 
background-image:url(/1mages/index Ol.gif); 
) 
#tuplan1 1 
width:686px: 
height:96px: 
background-image:url(/1mages/index 02.jpg): 
} 
/*mid 部 分 */ 
#daohang{ 
width:154px; 
height:173px: 
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background-image:url(/mages/index 03.jpg): 
} 

#banner{ 

width:686px; 

height:173px; 

} 

が tuplan21 

width:154px: 

height:308px: 
backeround-image:url(/images7index 05.jpg): 
} 

#lianjie{ 

width:327px; 

height:308px; 

} 

#biaoti{ 

width:359px; 

height:38px:! 

#word1 

width:359px; 

height:270px; 
background-image:url(/1mages/index 08.jpg); 
} 

#newsword!{ 

margin-top: 15px; 

margin-left: 180px; 

marein-right:40px: 

} 


/*bottom 部 分 */ 
#bot{ 
width:840px; 
height:70px: 
background-image:url(/1mages/index 09.gif); 
} 

.WenZ11 
margin-top: 15px; 
margin-left:40px; 
margin-right:40px; 
font-size: 1 6px; 
color:#62b400: 

) 

.nelTOng1 
margin-top: 13px; 
margin-left: 1 Spx; 

} 











制作 完成 后 即 可 以 在 下 浏览 器 中 显示 布局 后 的 效果 。 
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新 闻 系 统 





新 闻 系 统 规划 





新 闻 系 统 包括 前 台新 闻 显 示 和 后 台新 闻 管 理 两 部 分 内 容 。 数 据 库 的 设计 首先 要 设计 一 个 
存储 管理 者 账 志 和 密 但 的 数据 表 user， 还 要 设计 一 个 存储 新 闻 标 题 内 容 的 数据 表 news， 在 后 








面 实例 制作 的 过 程 中 能 够 实现 新 闻 资 料 的 储存 、 修 改 、 删 除 和 诬 加 功能 。 


| 系统 规划 设计 








本 系统 主要 分 成 用 户 浏 览 页 面 与 管理 者 登录 页 面 两 个 部 分 ， 其 中 index.asp 是 这 个 网 站 
的 首页 。 访 狐 闻 系统 主要 由 以 下 动态 网 页 构成 。 
@ index.asp: 网 站 狐 闻 的 首页 。 
news.asp: 显示 所 有 新 闻 标 题 的 页 面 。 
newscontent.asp: 显示 详细 狐 闻 内 容 的 页 面 。 
admin login.asp: 登录 后 人 台 管 理 页 面 。 
admin.asp: 新 闻 主 管理 页 面 。 
news add.asp: 增加 新 闻 的 页 面 。 
news upd.asp: 新 闻 更 新 页 面 。 
news del.asp: 删除 新 闻 页 面 。 


3 效 据 库 设 计 
本 实例 需要 建立 一 个 存储 新 闻 标 题 (title )、 新 闻 内 容 (content) 和 试 加 新 闻 时 间 


(fme) 等 字段 的 Access 数据 库 。 在 数据 库 中 必须 包含 一 个 容纳 上 述 信息 的 表 ， 这 个 表 为 新 
闻 信 息 表 ， 命 名 为 news。 创 建 的 新 闻 信 息 表 news 如 图 5-13 所 示 。 

















数据 类 型 
自动 编号 
文本 


各 注 
日 期 7/ 时间 








数据 类 型 决定 用 户 所 能 保存 在 该 字段 中 值 的 种 
类 。 接 Fl 键 可 得 看 有 关 数 据 类 型 的 帮助 。 

















$-13 ”创建 news 新 闻 信 息 表 
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数据 库 设 计 的 步骤 如 下 : 


规划 设计 新 闻 信 息 表 news 的 字段 结构 采用 表 5-1 的 结构 ， 


采用 表 5-2 所 示 的 结构 。 


- コ テー ANY 
意 文 


主题 编写 


留言 内 容 


留言 时 间 


に 


主题 编号 
用 户 账号 
用 户 密码 


字段 名 称 


首先 运行 Microsoft Access 2007 程序 。 








管理 者 信息 表 user 





自动 编号 长 整 型 


ms | し 上 
es | we | | * | 
mw  mWwml lw ー 


fi =Now() 


表 5-2 管理 者 信息 表 user 
数据 类 型 许 空 字 默 认 值 


Leams | sew | | 





打开 的 程序 界面 如 图 $-14 所 示 。 





bd | 





Ca a 
7 


cresett UiLce Uiul ine 


开 努 /和 范 馈 ルン oso な Office Access 


= ”打开 最 近 的 数 男 谋 
至 百 票 防 序 本 

le wm 新 建 室 身 数 需 库 こ プ 更 此 

Qa ee - ーー Ey DVFlarhtadhishep 


Eo) D:\sbap\adb\shop 





运行 “Microsoft Access 2007” 和 软件 


图 5-14 


单 击 “空白 数据 库 ” 按 钮 号 .， 在 主 界面 的 右 侧 打开 “空白 数据 库 ” 面板 ， 如 


$-13 所 示 。 


再 単 市 “空白 数据 库 ” 面 板 中 的 “浏览 到 某 个 位 置 来 存放 数据 库 ” 按钮 区 ， 
打开 “文件 新 建 数 据 库 ” 对 话 框 ， 在 “保存 位 置 ” 后面 的 下 拉 列 表 中 选择 前 面 创建 站 点 














chap05 中 的 mdb 文件 来 ， 在 “文件 名 ”文本 框 中 输入 文件 名 news， 在 “保存 类 型 ”下 拉 列 


表 框 中 选择 “Microsoft Office Access 2002-2003 数据 库 ”， 
GH) 单 击 “ 确 定 ” 按 钮 ， 返 回 “ 空 





如 图 5-16 所 示 。 
站 数据 库 ” 面 板 ， 如 图 5-17 所 示 。 








新 闻 系统 





8 on- - )* Microsoft Access 一 五 x 
Cd 
トー | 



























i ガ 努 舘 晴 Microsoft Office Access 
来 便 ressft 0 ce Osline RAR a 
[4 - 
个 人 ~ = | 
| 
nr HC 

UN 

A 

要 产 联系 入 に 1 3 


Da Hice Onine 


acck5 2007 的 本 功臣 

站 主语 新約 <<wf4 2007 可 二 重视 六 的 工 贞 . FUN ET 
EE A Ed 
| > し 


* Ee 07 MMYotoft Oot 2tem MEMMERREnE 
る ACCess 2007 周志 列国 境 网 
De a bd peg 4 


空白 数 娟 库 
你 全 任何 生 刘 放生 下 对 全 的 Microseft 


0 < heerss 

XED 

いい 3 
Canebtt A 34ttbbgsibMMOI Wy Decasiate\ 


CaS] Cm | 


= Office Oclias に PE だ し 」 
土 則 | 者 近 | 下 载 


自动 从 Clfice Onlne 更 新 此 方案 








5-15 打开 “ 衬 白 数据 库 ” 面 板 


文件 新 建 数据 库 
保存 位置 て) : 回 "也 癌 力 : 团 |Xx 功 国 : 














文件 名 fe): news wv 
ET 


$-16 设置 “文件 狐 建 数据 库 ” 对 话 框 








Cy の で = Mc esolt Accest hig 
< _ a - 困 
人 

su FE Microsoft Office Access 


eat orric Di 


に に = 
于 大 
と) 


1 特 る 避 民 者 





字 自 灶 间 库 
wr 
ュー eno 


ー 
® 
NMM 


交 作 名 人 


em 
EH 1 は 2 WT 理事 MP Et ME A 
CITY 
Oa ee We Ce Came DGG 生き 
i Or Te 


secs 200° MM TR 


村 9 Accei3 200! 各 外 要 里 交 入 二 局 ,可 。 。、 福 中 OTNMcrchoC 人 fic Syren な っ 
UKnTIEE SE nann OF "Horttrns 
PS 


人 


も し ュー モト SSS お 2 


FA De Orine WNLAD 





5-17 设置 文件 后 的 “ 空 日 数据 库 ” 面 板 








单 击 “空白 数据 库 ” 面 板 的 “创建 按钮 ” 即 在 Microsoft Access 2007 中 创建 


了 news.mdb 文件 ， 同 时 Microsoft Access 2007 自动 默认 生成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 如 
图 5-18 所 示 。 





= FE TE EE a | 
"EE 短 還 


图 5-18 ”创建 的 默认 数据 表 
用 鼠标 右键 单 击 选择 “ 表 1: 表 ” 数 据 表 ， 打 开 快 捷 菜 单 如 图 5-19 所 示 。 


ey [= rE 寺 に 一 工員 iatahuw1 : 現 環 本 UAccess 2002 - 3 立 畔 格式 - 上 y 


ここ 






































图 $-19 打开 的 快捷 菜单 命 


> 


选择 快捷 末 早 中 的 “设计 视图 ”命令 ， 打开 “ 男 存 为 ”对 话 框 ， 在 “ 表 名 称 ” 
文本 框 中 输入 数据 表 名 称 news， 如 图 5-20 所 示 。 





图 5-20 设置 “ 表 名 称 ” 














新 闻 系 统 


单 击 “确定 ”按钮 ， 即 在 “所 有 表 ” 列 表 框 中 建立 了 news 数据 表 ， 如 图 5-21 
所 示 。 


表 工 具 Database1 : 数据 库 (Access 2002 - 2003 文件 格式 ) - M.… 
| 设计 | 


a — 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 音 看 有 关 字 段 名 称 的 帮助 。 





设计 视图 。 F6 = 切换 窗 格 。 F1 = 帮助 。 


二 
$-21 建立 的 news 数据 表 


接 下 来 抜 表 5-1 所 示 输 入 字段 名 并 设置 其 属性 ， 


テーラ テー ビ 
区 資 其 完成 后 如 图 $-22 所 示 。 
4 字段 名 称 | 数据 类 型 
?ID 人 自动 编号 
title 文本 
content 
time 


说 明 人 
备注 
日 期 /时 间 








字段 层 性 





自动 输入 到 该 字段 中 、 作 为 新 记录 的 值 











图 $-22 ”创建 表 的 字段 
双击 轩 news: 表 ， 打 开 news 的 数据 表 ， 如 图 5-23 所 示 。 





为 了 方便 预 帘 ， 可 以 在 数据 库 中 预先 编 辑 一 些 记 录 对 象 ， 如 图 5-24 所 示 。 








用 上 述 的 方法 ， 建 立 一 个 名 为 user 的 数据 表 。 输 入 子 段 名 并 设置 其 属性 ， 如 


图 5-25 所 示 。 


编辑 完成 后 单 击 “保存 ”按钮 加 ， 完 成 数据 库 的 创建 ， 最 后 关闭 Access 2007 软件 。 数 
据 库 和 储存 用 户 名 和 密 



































记录 :44 第 1 项 ( 共 1 项 | -| 系 无 篇 选 器 -| | 搜索 
| 





数字 | 辆 呈 色色 瞩 ; 


$-23 ”创建 的 user 数据 表 





ID ご ia -| content -| time | 版 
中 睫毛 襄 性 价 大 比拼 日 常 生活 # ま すま ####### 
2 最短 時 同 靖 表 肌 肘 下 雅 夏 日 里 尽 ### 人 人 ### を 
3 详解 时 下 最 流行 美体 概念 体形 护理 ########## 
4 沙发 瑜 如 8 式 瘦身 效果 佳 谁 说 减 /于 着 兴 拓 林 闪失 基 枯 拓 六 枯 
5 舒展 身体 打造 运动 美人 适合 减肥 ########### 
6 健美 操 减 肥 的 益处 可 以 增强 关 尖 拓 林 天 枯 基准 拓 关 枯 
7 跳舞 减肥 最 新 方法 跳 押 是 一 9 せま ####### 
8 按 体 型 选择 最 佳 减 肥 运 动 保持 形体 ########## 
9 壁球 与 墙壁 搏击 的 运动 健常 能 在 # す ######### 

10 跑步 记 住 “ 慢 ” 和 “上 暗 ” 有 一 些 人 ########### 


11 促使 疹 背 挺 直 的 简单 体操 
14 随 “ 心 ”所 欲 去 健身 
(新建) 


年 轻 人 加 ### 人 人 ### 共 # 
怖 洋洋 地 まま 
すす ###### せ せ せ # 


$-24 news 表 中 的 输入 记录 


news : 数据 库 (Access 2002 - 2003 .… 


























总 | USETIaE 7 


(新建 


浆 | 的 | 前 招租 
FSS に は 
i 6 邊 仁村 





aa | ee 


password |. 
由 admin admin 


) 





( 筐 1 項 共 1 項 し り !| 逐 





数字 中 国 四 中 多 | 


5-25 user 数据 表 





:人权 等 资料 的 数据 表 建 立 完毕 。 








新 间 系 统 








于 于 数据 库 连 接 


数据 库 编辑 完成 后 ， 必 须 在 Dreamweaver CS5 中 建立 能 够 使 用 的 数据 源 连 接 对 象 。 这 样 才 > 
能 在 动态 网 页 中 使 用 这 个 数据 库 文 件 。 操 作 过 程 中 要 特别 注意 ODBC 连接 参数 的 设置 。 
基体 连接 步骤 如 下 : 
在 “控制 面板 ” 中， 选择“ 管理 工具 ”打开 管理 工具 窗口 ， 双 击 运行 “数据 源 
(ODBC)” 的 快捷 方式 咒 …”， 将 打开 如 图 5-26 所 示 的 “ODBC 数据 源 管理 器 ”对 话 框 。 
单 击 “ODBC 数据 源 宫 理 占 ” 对 话 框 中 的 “系统 DSN” 选 项 卡 ， 如 图 5-27 
所 示 。 


を 10DBC 数据 和 源 管 理 壳 を 10ODBC 吏 据 源 管理 腕 
用 户 DSH | 系统 DSN | 文件 DSN | 驱动 程序 | 跟踪 | 连接 池 | 关 于 | 用 户 DSH 系统 DSH | 立件 DSH | 驱动 程序 | 跟踪 “| 连接 池 | 关于 | 
用 户 数据 源 ⑪) : 系统 数据 源 G) : 


添加 Q⑪).… | 驱动 程序 添加 四 ).. "| 


FEAT Driver do Microsoft Access [*.mdb) 














Microsoft Access dBASE Driver (*.d 


Excel Fil Mi ft Excel Dri -Xl 6 | - 
XCe iles 1crosott Exce river (kx S， 1 册 险 (R) 册 | 除 (E) 
配置 C).. 


NS Access Database Microsoft Access Driver (*.mdb, 





图 5-26 ODBC 数 据 源 管理 器 中 的 用 上 DSN 图 5-27 ODBC 数 据 源 管理 器 中 的 系 筑 DSN 


在 “系统 DSN” 对 话 框 中 单 击 “ 添 加 (D)” 按 钮 ， 打 开 “ 创 建 靳 数据 源 ” 对 


话 框 ， 如 图 5-28 所 示 。 
在 “创建 数据 源 ” 对 话 框 中 ， 选 择 “Driver do Microsoft Access (*.mdb)” 选 
项 ， 然 后 单 击 “ 完 成 ”按钮 。 打 开 “ODBC Microsoft Access 安装 ”对 话 杠 ， 在 “数据 源 名 


(N)” 文 本 框 中 输入 news， 如 图 5-29 所 示 。 








ODBC Nicrosoft Access 安装 
选择 您 想 为 其 安装 数据 源 的 驱动 程序 (8)。 数 据 源 名 W): [new| 
说 明 血 ): | 
da Microsoft exto [*. 取消 
r d et oft dE *. dbE) ーー 
er do soft Excel (*. xls) 6 
o ee Faradox 9 tr. db ) 数据 库 : ue 
a 0 6 Heroso is oxPro 选择 G). . . | 创建 C)... | 修 腥 (R)... | 压缩 商 )... | ーー 
Et et tl いむ 高 级 由 .| 


系统 数据 库 


人 元 ) 
"数 据 座 て): 


322: まり 选项 (0) >> | 





图 5-28 ”创建 数据 源 图 5-29 ODBC Microsoft Access 设置 


单 击 “ 选 择 (S)” 按 钮 打开“ 选择 数据 库 ” 对 话 框 ， 如 图 5-30 所 示 。 単 二 
“驱动 器 (V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 二， 从 下 拉 菜 单 中 找到 在 创建 数据 库 步 骤 中 数据 库 








2 
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所 在 的 盘 符 ， 在 “目录 (D) :” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 
左上 方 “数 据 麻 名 〈A)” 选 项 组 中 的 数据 库 文 件 newsumdb, 員数 据 麻 名 称 目 効 添加 色 “数 
据 库 名 (A)” 下 的 文 本 権 中 。 

技 到 数据 库 后 ， 在 “选择 数据 库 ” 对 话 框 中 单 击 “ 确 定 ” 按 钮 ， 回 到 “ODBC 
Microsoft Access 安装 ”对 话 框 中 ， 再 次 单 击 “确定 ”按钮 ， 将 返回 到 “ODBC 数据 源 管 理 
器 ”中 的 “系统 DSN” 对 话 框 中 ， 则 可 以 看 到 “系统 数据 源 ” 中 已 经 添加 了 一 个 名 称 为 
news， 驱动 程序 为 “Driver do Microsoft Access (*.mdb)” 的 系统 数据 源 ， 如 图 5-31 所 示 。 

eoDpc 数据 源 管理 器 


用 户 nsm 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系统 数据 源 S): 














目录 ⑪) : 
[news. mdb d: chapD5'mdb 


nnEC 系统 数据 可 与 指 连接 的 信息 。 系 
统 数据 源 对 当月 可 见 ， 服务 


文件 美 型 て ): 驱动 器 (\) : 


图 5-30 ”选择 数据 库 图 5-31 ODBC 数 据 源 管理 器 


再 次 单 击 “ 确 定 ” 投 钮 ， 完 成 “ODBC 数据 源 管 理 右 ” 中 “系统 DSN” 的 设置 。 

局 动 Dreamweaver CS5， 打 开 建 并 的 Chap05 站 点 ， 并 打开 index.html 页 面 ， 
将 文件 另存 为 index.asp 由 面 ， 在 Dreamweaver CSS 软件 中 执行 灯 蛙 栏 中 的 “窗口 ”一 “ 数 
据 库 ”命令 ， 打 开 “ 数 据 库 ”面板 。 

单 击 “ 数 据 库 ”面板 中 的 加 号 “+” 按 钮 ， 打 开 下 拉 菜 单 ， 单 击 选 择 “ 数 据 源 
名 称 (DSN)? 命 金 。 

打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 :” 文 本 框 中 输入 
news， 单 击 “ 数 据 源 名 称 (DSN): ”文本 框 右 侧 的 下 拉 三 角 按钮 *， 从 打开 的 下 拉 菜 单 
中 选择 在 “数据 源 (ODBC)” 一 “系统 DSN” 中 所 添加 的 news， 其 他 保持 默认 值 ， 如 
$-32 所 示 。 























数据 源 名 称 (D5NH) 


连接 名 称 : ne*| 
数据 源 名 称 (DSH): | news 


用 户 名 : 








密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSW 
② 使 用 本 地 DSH 





图 5-32 数 据 源 名 称 (DSN) 


在 “数据 源 名 称 (DSN)” 页 面 中 ， 单 击 “ 测 试 ”按钮 ， 如 打开 图 5-33 所 示 页 
面 ， 则 说 明 数 据 库 连接 成 功 ， 奋 则 应 逐一 检验 之 前 各 项 步 又 是 否 正确 完成 ， 修 改 全 测试 成 功 








统 





后 ， 单 击 “ 确 定 ” 投 钮 则 完成 此 步骤 。 
同时 在 网 站 根 目 录 下 将 自动 创建 一 个 名 为 Connections 的 文件 来 , Connections 
文件 夹 内 有 一 个 名 为 news.asp 的 文件 , news.asp 文件 可 以 用 记事 本 打开 ， 如 图 5-34 所 示 。 


回 回 図 


编辑 区 ) 格式 Q) 查看 QW) 帮助 0) 





' FileName="'Connection odbc_conn_dsn.htm" 
' Type="ADO" 

' DesigntimeType="'ADO" 

' HTTP="'false" 

' Catalog=""" 

”Schema=”” 

Dim HH news_ STRING 

Hl news _ STRING = "dsn=news;" 

る > 





图 5-33 ”成 功 创建 连接 脚本 图 5-34 成功 创建 连接 脚本 
至 此 ， 完 成 数据 库 的 连接 操作 。 





| Section | 











网 站 在 首页 中 有 一 个 显示 狐 闻 的 模 其 ， 访 问 者 可 以 单 击 “更 多 ”和 “more” 文 字 链 接 进 
入 显示 新 闻 标 题 的 页 面 进行 浏览 。 单 击 想 要 浏览 的 新 闻 标 题 即 可 进入 该 新 闻 的 详细 内 容 页 面 。 


引 新 闻 首页 的 设计 









狐 闻 发 布 后 ， 应 该 让 网 站 访问 者 在 站 外 中 看 到 最 新 发 布 的 新 闻 ， 本 市 将 主要 介绍 如 何在 


首页 index.asp 页 面 中 制作 新 闻 系 统 的 标题 显示 功能 。 
制作 步骤 如 下 : 
将 打开 的 index.asp 制作 成 静态 的 页 面 效 末 如 网 5-35 所 示 。 


Wi 文 ## 钨 提 (1) 查看 (7) 手 入 (I) 机 站 全 拉 式 0) 合 を C) 站 点 (5} 便 口 W) 共生 GD | に ” [SI 万 再 
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5-35 ”设计 的 静态 网 页 效果 
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接 下 来 利用 “ 绑 定 ”功能 ， 将 网 页 所 需要 的 数据 学 段 连 接 至 网 页 。 蛙 击 “ 绑 
定 ” 和 面板 ， 并 在 面板 中 单 击 “ 增 加 绑 定 ”按钮 “+”， 在 弹出 的 亲 蛙 中 选择 “记录 集 (但 
询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 : 

@ 在 “名 称 ” 文 本 框 中 输入 rs news 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 沫 单 中 选择 news 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 沫 单 中 ， 选 择 使 用 的 数 

据 库 表 对 象 为 news。 

@ 在 “ 列 ” 栏 中 选择 “全 部 ” 单 选 近 钮 。 

@ 设置 “ 饶 选 ”的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 这 单 中 选择 了 选项 ， 然 

后 选择 “降序 ”的 排列 顺序 。 

单 击 “ 确 定 ” 投 钮 即 完成 设 定 ， 如 图 $-36 
所 示 。 

绑 定 记录 集 后 ， 将 记录 集 的 
frs news.itle! 字 段 捕 入 全 index.asp 网 页 的 适当 
位 置 ， 如 图 5-37 所 示 。 


DMW 文件 (7】 貫 括 (gm) 查 着 17) 手 入 (I) 容 層 (mW) 榨 式 们 ) 合 を C) 站 点 人 5 请 口 (1) 北 動 OO 尺 t 咕 ” [号 天 局 
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图 5-37 插入 {rs news.ttle! 全 index.asp 网 页 中 
在 数据 库 中 加 入 相应 的 数据 后 ， 上 面具 能 显示 第 一 条 最 新 新 闻 记 录 ， 如 采 需 要 
显示 5 条 最 新 记录 ， 那 么 殴 必 须 设置 “重复 区 域 ” 功 能 。 单 击 选中 index.asp 页 面 中 需要 重 
复 的 行 ， 如 图 $-38 所 示 。 

















图 5-38 选择 需要 重复 的 行 











第 5 章 証 電 男 員 隊 2S 父 2 








单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 接 
着 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 。 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 
数据 “记录 ”为 5， 如 图 5-39 所 示 。 
单 击 “ 确 定 ”按钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选取 要 重复 的 区 域 左上 角 出 现 (>) 

















了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 图 5-40 所 示 。 站 


遷 





trs news. title} 














图 $-39 ”选择 一 次 可 以 显示 的 记录 数 图 5-40 ” 设 定 重复 功能 后 的 效 琳 





index.asp 页 面 除 了 显示 新 闻 标 题 外 ， 还 要 提供 浏览 者 单 击 标题 链接 至 详细 内 容 
页 面 阅 读 新 闻 内 容 的 功能 ， 首 先 选 取 编 辑 页 面 中 的 新 闻 标 题字 段 {rs_news.title} 。 

单 击 “ 应 用 程序 ”面板 中 的 “服务 喜 行 为 ”标签 中 的 “+” 号 按钮 ， 在 弹出 的 
末 单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 打 开 “ 转 到 详细 页 面 ” 对 话 框 如 图 5-41 所 示 。 设 
置 “ 详 细 信 息 页 ”的 链接 路 径 为 mnewsmnewscontentasp， 其 他 设 定 值 篆 不 改变 其 默认 值 。 











详细 信息 页 : news/newscontent. asp | 
传递 URL 参数 : Tn 设置 为 以 下 项 的 值 











v 





列 : II ママ 
传递 现 有 参数 : | ] URL 参数 
[表单 参数 








图 5-41 “ 转 到 详细 页 面 ” 对 话 框 
单 击 “ 人 确定 ”按钮 回 到 编辑 页 面 ， 单 击 女 标 选 择 帝 “more” 的 图 片 ， 在 其 对 应 
的 “属性 ”面板 中 的 “链接 ”文本 框 中 输入 : /news/mews.asp， 将 其 设置 为 指 问 news 文件 夹 
中 news.asp 页 面 链接 ， 如 图 5-42 所 示 。 
ti 























図像 , 4K 宽 门 源 女 件 G) fimages/index_OT. JPE 6 円) 替换 并 ) | マ 类 号 ) 无 1 
| | 高 | | 本 接 OER oc 从 和 固 ゆ 
地図 ⑩ | 委 直 边 距 [| 。 目标 @)| v| ”边框 @) [过 茹 和 4 
人 | 门 站 〇 NJ 水 平 边 距 EE)| | 原始 | | ey PS 于 齐 &&) | 默认 值 v 


图 5-42 ”设置 “more...” 文 字 链 接 


现在 主页 面 index.asp 的 设计 与 制作 都 已 经 完成 ， 按 (F12〉 键 可 打开 TE 浏览 









虱 预 喉 目 前 制作 的 结果 ， 如 图 $-43 所 示 。 
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图 5-43 ”主页 面 的 设计 结 








接 下 来 我 们 将 设计 新 闻 系 统 的 主页 面 news.asp， 这 个 页 面 将 显示 新 闻 系 统 中 所 有 的 新 闻 
标题 ， 浏 览 者 可 以 通过 单 击 要 阅读 的 新 闻 标 题 链接 到 每 一 


面 的 版 面 设计 效 末 如 图 5-44 所 示 。 
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详细 制作 步骤 如 下 : 
局 动 Dreamweaver CSS$， 人 制作 该 页 面 的 静态 效果 如 图 5-45 所 示 。 
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单 击 “ 绑 定 ”面板 中 的 “+” 号 按钮 ， 在 弹出 的 荣 单 中 ， 选 择 “ 记 录 集 〈 得 
询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 设 
定 ， 如 图 5-46 所 示 。 


2 
连接 
表格 


列 : で) 全 部 全 选 定 的 : 





$-46 绑 定 Ts xnews 记录 集 





@ 在 “名 称 ” 文 本 框 中 输入 rs_xnews 作为 该 记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 连 接 对 象 。 
@ 从 “和 表格” 下拉 列表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 
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@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 投 钮 。 

@ 设置 “人 沛 选 ” 有 的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 列 表 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 

绑 定 记录 集 后 ， 将 记录 集中 的 frs xnews.title! 和 {rs xnews.tme} 字 段 插 入 至 
news.asp 网 页 的 适当 位 置 ， 如 图 5-47 所 示 。 











中 新闻 中 上 | 


{rs mews.t1t]ai {rs xnews. time} 


目前 没有 性 何 新 闻 











图 5-47 插入 学 段 全 news.asp 网 页 中 








在 数据 库 中 加 入 相应 数据 后 ， 网 页 上 只 显示 第 一 条 最 新 新 闻 记 录 ， 因 此 ， 需 要 
加 入 “服务 占 行 为 ”中 的 “重复 区 域 ” 的 功能 ， 单 击 选 中 news.asp 页 面 中 需要 重复 的 
行 ， 如 图 $-48 所 示 。 























{rs xnews. timel 





{rs xnews. title} 





图 5-48 ” 单 击 选中 需要 重复 的 单元 格 


然后 再 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 中 的 “+” 号 按 
包 ， 在 弹出 的 菜单 中 选择 “重复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 如 图 5-49 
所 示 。 















































5 (9 の) 10 | 记录 


し ) 所 有 记录 





图 5-49 ”选择 一 次 可 以 显示 的 记录 数 为 10 











单 击 “确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 左 上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 图 5-50 所 示 。 








新 闻 中 四 | 














图 5-50 ”完成 重复 设置 的 效果 
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如 果 数 据 库 中 没有 任何 数据 ， 希 望 隐 忠 新 闻 子 段 绑 定 的 行 ， 并且 显示 “目前 没 
有 任何 狐 闻 ”的 文子 说 明 ， 需 要 加 入 显示 区 域 功能 设 首 。 肯 先 选取 记录 集 有 数据 时 要 显示 的 
行 ， 如 图 5-51 所 示 。 























图 5-51 选择 要 显示 的 记录 所 在 的 行 


单 击 “ 应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 “+” 号 按钮 ， 在 弹出 的 
菜单 列表 中 ， 选 择 “ 显 示 区 域 /如果 记录 集 不 为 空 则 显示 区 域 ”选项 。 

打开 “如 果 记 录 集 为 空 则 显示 区 域 ” 对 话 框 ， 你 持 献 认 值 ， 单 击 “ 确 定 ” 按 钮 
回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 显示 的 区 域 左 上 角 出 现 了 一 个 “如 果 人 符合 此 条 件 则 显 
示 .…” 的 灰色 和 疮 标 ， 这 表示 已 经 完成 设置 。 设 置 及 效 末 如 图 5-52 所 示 。 


节 当 从 邓 集 趟 为 空 则 显示 区 其 
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图 5-52 ”设置 及 效果 











接 下 来 选中 记录 集 没 有 数据 时 要 显示 的 行 ， 如 图 5-53 所 示 。 


本 前 流 有 性 何 新 闻 














图 5-53 ”选中 没有 数据 时 显示 的 区 域 


单 击 “ 应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 
的 荣 单列 表 中 ， 选 择 “ 显 示 区 域 / 如 朱 记 录 集 为 空 则 显示 区 域 ” 选 项 。 打 开 “ 如 果 记 录 集 为 
空 则 显示 区 域 ” 对 话 框 ， 保 持 默认 值 ， 如 图 5-54 所 示 。 单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 
将 发 现 先前 所 选中 要 显示 的 区 域 堪 上 角 出 现 了 一 个 “如 末 符 合 此 条 件 则 显示 …” 的 灰色 疮 
标 ， 这 表示 已 经 完成 设 定 。 





























节 津 侣 杀 集 为 空 则 显示 区 其 






































图 5-54 ”设置 “如 果 记 录 集 为 空 则 显示 区 域 ” 对 话 框 
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接 下 来 插入 “记录 集 导航 条 ”功能 ， 把 ha 
展 标 移 至 要 加 入 “记录 集 导 航 条 ”的 位 置 ， 单 击 “ 插 恒 。 导入 表格 式 数据 人 
入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 和 集 导 航 条 ” pe 
按钮 总， 如 图 5-55 所 示 。 [去 Spry 重复 项 

打开 “记录 集 导航 条 ”对 话 框 ， 单 击 先 ee 
择 “ 记 录 集 ”后 面 的 下 拉 三 角 按钮 ， 在 下 拉 菜 单 中 先 @ 9s 
择 rs xnews 记录 集 ， 然 后 再 单 击 选择 “显示 方式 ” 为 ee 
“文本 ” 单 选 按钮 ， 最 后 单 击 “ 确 定 ” 按 钮 回 到 编辑 ee 。 

ぐぅ ”记录 和 集 分 页 : 记录 集 导 航 条 





页 面 ， 将 发 现 页 面 中 目 动 插入 记录 集 的 导航 条 ， 如 儿 
5-56 所 示 。 图 5-55 选择 搬入 记录 集 导 航 条 按钮 








和 新闻 中 山 | 


如 果 符 合 此 条 件 则 显示 . 















































图 5-56 ”添加 记录 集 导 航 条 


在 news.asp 页 面 中 除了 显示 网 站 中 所 有 的 新 闻 标题 外 ， 还 要 为 浏览 者 提供 单 
击 新 闻 标题 内 容 可 链接 至 详细 内 容 页 的 功能 ， 因 此 需要 加 入 “ 转 到 详细 页 面 ”服务 器 行为 。 
首先 选中 {rs_xnews.title} 字 段 ， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 
号 “+” 按钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ”的 选项 ， 如 图 5-57 所 示 。 



























































图 5-57 ”选择 狐 闻 标 题字 段 


打开 “ 转 到 详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 
框 ， 选 择 news 文件 夹 中 的 newscontent.asp， 其 他 设 定 值 丝 不 改变 其 默认 值 ， 如 图 5-58 所 示 。 


转 和 到 详细 页 面 


链接 : 
详细 信息 页 : newscontent. asp 下 


传递 EL 参数 : Tn | 设置 为 以 下 项 的 值 
记录 集 加 | rs _Xnews AAA 
列 : Tn | 








传递 现 有 参数 : [] WRL 和 参数 
口 ] 表单 参数 





图 5-58 “ 转 到 详细 页 面 ” 对 话 框 














单 击 “ 确 定 ” 按 钮 返回 编辑 页 面 ， 现 在 系统 主页 面 news.asp 的 制作 已 经 完 
成 ， 按 F12 键 可 以 打开 正 浏 览 器 预览 目前 制作 的 效果 ， 如 图 5-59 所 示 。 
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图 5-59 ”系统 主页 面 的 设计 效果 


天 并 恒 新 闻 内 容 J 面 。 。 


制作 新 闻 的 详细 内 容 页 面 newscontent.asp， 这 个 页 面 的 功能 用 于 显示 浏览 者 单 击 新 闻 标 
题 时 打开 的 详细 新 闻 内 容 。 设 计 的 重点 在 于 如 何 接收 主页 面 news.asp 所 传递 的 参数 ， 并 根据 
这 个 参数 显示 数据 库 的 记录 内 容 ， 新 闻 内 容 页 面 的 版 面 设计 效果 如 网 5-60 所 示 。 
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图 5-60 产 闻 内 容 页 面 设 计 效 末 
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详细 操作 步骤 如 下 : 
启动 Dreamweaver CS5， 设 计 静 态 的 页 面 效 果 如 图 5-61 所 示 。 
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5-61 新闻 内 容 页 面 设计 





单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 ( 查 
询 )” 和 选项。 打开“ 记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 ， 
如 图 5-62 所 示 。 





冰 称 : rs content 
表格 ; 


列 : で ) 全部 。 馈 选 定 的 : 


WF aa 司 





$-62 設定 rs content 记录 集 


@ 在 “名 称 ” 文 本 框 中 输入 rs content 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 讽 普 “和 莽 选 ”的 条 件 为 “ID=URL 参数 /ID ”。 

@ 在 “排序 ”下 拉 列 表 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 


























新 闻 系 统 





绑 定 记录 集 后 ， 将 记录 集中 的 frs_contenttitley 和 frs_content.contenft 字段 插入 
全 newscontent.asp 页 面 的 适当 位 置 ， 如 网 $-63 所 示 。 
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$-63 ”将 相应 字段 的 插入 


设置 完毕 后 先 打开 index.asp 页 面 ， 按 下 F12 键 单 击 其 中 第 一 个 标题 ， 得 到 打 
开 的 详细 新 闻 内 容 页 面 ， 效 果 如 图 $-64 所 示 。 
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$-64 浏览 效果 图 


il 


台 管 理 








狐 闻 系统 的 后 台 官 理 系 统 对 于 带 有 新 闻 系 统 的 网 站 非常 重 要 ， 因 为 新 闻 要 你 持 实 时 性 。 
官 理 者 可 以 登录 后 台 ， 实 时 增加 、 修 改 或 删除 数据 库 中 的 新 闻 内 容 ， 使 网 站 能 随时 你 持 最 
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新 、 最 实时 的 信息 。 后 台 管 理 主页 面 的 效果 如 图 5-65 所 示 。 
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5-65 ”将 要 制 作 的 后 全 管理 主页 面 


引 后 台 登 录 页 面 


由 于 管理 者 接口 是 不 允许 网 站 浏览 者 进入 的 ， 因 此 必须 为 管理 者 设置 权限 。 我 们 可 以 利 
用 登入 账号 与 密码 实现 这 个 功能 ， 详 细 操 作 步 又 如 下 : 

局 动 Dreamweaver CSS， 执 行 沫 单 栏 中 的 “文件 ”一 “新 建 ” 人 命令， 打开“ 新 
建文 要 ”对 话 框 ， 选 择 “ 罕 昌 页 ”选项 卡 中 的 “页 面 类 型 ”列表 框 下 的 ASP VBScript 选 
项 ， 在 “布局 ”列表 框 中 选择 “无 ”选项 ， 然 后 单 击 “创建 ”按钮 创建 狐 页 耐 ， 输 入 网 页 标 
题 “ 后 人 台 管 理 登 录 ” 执行 灯 单 栏 中 的 “文件 ”一 “保存 ”命令 ， 在 站 点 中 将 该 文档 你 存 为 
admin login.asp。 

执行 荣 单 栏 中 的 “插入 ”一 “表单 ”一 “表单 ”命令 ， 插 入 一 个 表单 。 

将 鼠标 指针 放置 在 该 表单 中 ， 执 行 来 
单 栏 中 的 “搬入” 一“ 表格” 命令， 打开 “表格 ” 
对 话 框 ， 在 “ 行 数 ” 文 本 框 中 输入 需要 插入 表格 的 
行 数 为 4。 在 “ 列 数 ” 文 本 框 中 输入 需要 插入 表格 
的 列 数 为 2。 在 “表格 宽度 ”文本 框 中 输入 400, 
单位 选择 “像素 ”。 其 他 参数 保持 默认 值 ， 如 网 5-66 
所 示 。 









































辅助 功能 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 一 


单 击 “确定 ”按钮 ， 在 该 表单 中 插入 | 


4 行 2 列 的 表格 ， 选 择 表 格 并 在 “属性 ”面板 中 设 ”I 











置 对 齐 方式 为 居中 对 齐 。 单 击 和 鼠标 左 键 并 拖 忠 鼠标 | ー 
选择 第 1 行 表格 ， 选 中 表格 的 第 1 行 后 , 在 “ 属 上 上 ご = 
性 ”面板 中 单 击 “ 合 并 所 选单 元 格 ， 使 用 跨度 ” 按 图 5-66 插入 表格 





取消 
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钮 中， 将 第 1 行 表格 合并 。 用 同样 的 方法 把 第 4 行 合 并 。 得 到 的 效果 如 图 5-67 所 示 。 
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<body> <form#forml > 584 x 148v 3 下 站 1 秘 简体 中 站 (6B2312) 


5-67 合并 单元 格 


在 该 表格 中 的 第 1 行 中 物 入 文字 “ 后 台 管理 ”, 在 表格 第 2 行 的 第 1 个 单元 
格 中 输入 文学 说 明 “ 用 户 :”， 在 第 2 行 表格 的 第 2 个 单元 格 中 单 击 “ 文 本 域 ” 按 钮 四， 
插入 单行 文本 域 表 单 对 象 ， 定 义 文 本 域名 为 username。“ 文 本 域 ”属性 设置 及 此 时 的 效果 
如 图 $-68 所 示 。 


RE 上 
口 文本 域 ED | HONGD OW ONY  #O[E 党 
晤 多 字符 数 | | | 
口 禁 用 四 ) 
口 只 读 &) 











で ni chapos news\admin_ login asp (KHTML)* = 回 


ON = 


SE ES ES ES Ec 


ES ER 
odv> <form. .. > <table> <tr>Ktd2 [kD Q 100X 584x148v3K/1 秒 簡体 中 文 (GB2312)  .: 
5-68 输入 “用 户 ” 名 和 插入 “文本 域 ” 的 设置 和 效果 图 
在 表格 第 3 行 的 第 1 个 单元 格 中 输入 文子 说 明 “ 和 密码: ”， 在 表格 第 3 行 的 第 2 














个 单元 格 中 单 击 “ 文 本 域 ” 投 钮 加 ， 插 入 单行 文本 域 表 单 对 象 ， 定 义 文本 域名 为 password。 
“文本 域 ”属性 设置 及 此 时 的 效果 如 图 5-69 所 示 。 


民 性 
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ED: \chapos\news\admin_ login. asp (KHTML)* = lx 


ssasarararstasgs = 


， 夫 旨 
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<body> <form#forml > 584 x 148v 4 下 /1 秒 简体 中 人 总 (G682312) 


5-69 输入 “密码 ”名 和 插入 “文本 域 ” 的 设置 及 效果 
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单 击 选择 第 4 行 单元 格 ， 执 行 菜单 栏 中 的 “插入 ”一 “表单 ”一 “按钮 ” 合 
令 ， 执 行 两 次 该 命令， 插入 两 个 按钮 ， 并 分 别 在 “属性 ”面板 中 进行 属性 变更 ， 将 一 个 按钮 
的 “动作 ”设置 为 “提交 表单 ” 单 选 按钮 ， 另 一 个 设置 为 “ 重 设 表单 ” 单 选 按钮 ,“ 属 性 ” 
面板 中 的 具体 参数 设置 及 效果 如 图 5-70 所 示 。 
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图 5-70 ”设置 按钮 名 称 的 属性 及 效果 


单 击 “应 用 程序 ” 睾 板 中 的 “服务 器 行为 ”标签 中 的 “+” 瑟 按钮 ， 在 弹出 的 
玉 单 列表 中 选择 “用 户 映 份 验证 /登录 用 户 ” 的 选项 。 

打开 “登录 用 户 ” 对 话 杠 ， 进 行 如 下 设置 : 

@ 从 “从 表单 获取 输入 ”下 拉 末 早 中 选择 该 服务 右 行 为 使 用 网 页 中 的 form1 表 単 対象 中 
浏览 者 填写 的 对 象 。 

@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 username 对 象 ， 议 定 该 用 户 登 录 服 务 器 行 
为 的 用 户 名 数据 来 源 为 表单 的 username 文本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 该 用 户 登 录 服 务 器 行为 
的 用 户 名 数据 来 源 为 表单 的 password 文本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
neWS。 

@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 占 行为 使 用 到 的 数据 库 表 对 象 为 user。 

@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 user 存储 用 户 名 的 字段 为 username 字段 。 

@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 user 存储 用 户 密码 的 字段 为 password 字段 。 

@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 问 admin.asp 页面 。 

@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 问 ../index.asp 页 面 。 

@ 选择 “基于 以 下 项 限制 访问 ”后 面 的 “用 户 名 和 密码” 单 选 按 钮 。 

设置 如 图 5-71 所 示 。 




















































































































执行 染 单 栏 中 的 “窗口 ”一 “行为 ”命令 ， 打 开 “ 行 为 ”面板 ， 单 击 “ 行 为 ” 
面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 行为 列表 中 ， 选 择 “ 检 得 表单 ”命令 ， 打 开 “ 检 得 表 
单 ” 对 话 框 ， 将 usemame 和 password 文本 域 的 人 都 设置 为 “ 必 和 需 的 ”在 “可 接受 ”区 域 移 
择 “ 任 何 东 西 ” 单 选 按 钮 ， 设 置 如 图 $-72 所 示 。 








从 表单 获 职 输入 :51 
用 户 名 字段 : |usernane | 
密码 字段 : |password 。。 マツ 
使 用 连接 验证 : nsws v 
表格 : sr ~ 
用 户 名 列 : | usernane | 
[| 转 到 前 一 个 URL( 如 果 它 存在 ) 值 ， 回 必需 的 
如 果 登 录 失 败 ， 转 到 :| /index.asp = 
基于 以 下 项 限制 沪 问 : ”用户 名 和 密码 


O 可 接受 : ”任何 东西 
用 户 名 、 密 码 和 访问 级 别 
获 职 级别 自 : 〇 电子 邮件 地 址 〇 数字 | | 到 | | 





















































$-71 登录 用 户 的 设 定 $-72 ”设置 检查 表单 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 管 理 者 登录 页 面 admin login.asp 已 经 制作 
完成 ， 完 成 后 的 效果 如 图 $-73 所 示 。 


DW 文件 (7) 篇 辑 (2) 查看 (W) 所 入 GT) 铸 避 得) 格式 0) 交合 全 ) 站 点 可】 全 DC) 帮 有 购 (0 | 











bd ST | 实时 代码 マイ RM 仙田 、 机 査 多 二“ 
© © は hs ‘Pp et/ seins Len yg 


sir> omaatorly 


格式 ぜ ) 无 











图 5-73 设置 管理 进入 界面 


只 








管理 系 统 后 台 主 页 面 是 在 系统 管理 者 登录 验证 成 功 后 ， 所 进入 的 页 面 。 在 该 负面 中 管理 
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者 可 以 实时 新 培 、 修 改 或 删除 数据 库 的 新闻 内 容 ， 使 网 站 能 随时 你 持 最 刹 、 最 实时 的 信息 。 
系统 管理 主页 面 admin.asp 的 内 容 设计 与 系统 主页 面 news.asp 大 致 相同 ， 不 同 的 是 增加 了 可 
以 链接 到 纺 辑 页 面 的 “修改 ”和 “删除 ”文字 链接 ， 毅 态 部 分 的 页 面 结 构 如 网 $-74 所 示 。 
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5-74 页 面 静态 效 末 


详细 操作 步骤 如 下 : 

与 系统 主页 面 news.asp 相同 ， 系 统管 理 后 台 主 页 面 admin.asp 也 要 显示 数据 库 
的 所 有 新 闻 数 据 ， 但 是 两 者 的 目的 是 有 差别 的 ， 前 者 的 目的 是 为 浏览 者 提供 所 有 的 新 闻 标 题 
内 容 并 通过 单 击 可 链接 至 详细 内 容 页 ， 后 者 的 目的 则 是 为 管理 者 提供 修改 或 删除 数据 的 功 
能 。 接 下 来 开始 动态 部 分 的 设计 ， 首 先 单 击 “ 绑 定 ” 面 板 ， 并 在 面板 中 单 击 “ 增 加 绑 定 ” 鬼 
钮 “+”， 在 弹出 的 菜 音 中， 选择“ 记录 集 〈 得 询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “确定 ” 按 钮 完成 设 定 ， 
如 图 5-75 所 示 。 
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$-75 設定 rs admin 记录 集 














第 5 章 放置 下村 2 寺 人 








@ 在 “名 称 ” 文 本 框 中 输入 rs_admin 作为 该 记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 沫 单 中 选择 news 数据 源 连 接 对 象 。 
@ 从 “表格 ”下 拉 染 单 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 
@ 在 “ 列 ” 栏 中 选择 “全 部 ” 单 选 按钮 。 © 
@ 设置 “人 沛 选 ” 的 条 件 为 “无 ” 
@ 在 “排序 ”下 拉 末 单 中 选择 “ID” 选 项 ， 然 后 选择 “升序 ”的 排列 顺序 。 
绑 定 记录 集 后 ， 将 记录 集中 的 {rs_admin.ID} 、 frs admin.title} 以 及 
{rs admin.tme! 字 段 捕 入 全 admin.asp 网 页 的 适当 位 置 ， 如 图 5-76 所 示 。 











新 闻 由 响 


r-----------------------------------------------------------------] 








PT TIi {rs_admin. title} 人 rs_admin. time] ”修改 册 阶 








图 5-76 ”记录 和 集 的 字段 插入 全 news admin.asp 网 页 








由 于 news_admin.asp 页 面 需要 显示 数据 库 中 的 所 有 记录 ， 而 目前 的 设 定 则 只 
能 显示 数据 库 的 第 一 条 数据 ， 需 要 加 入 “服务 喜 行 为 ”中 的 “重复 区 域 ” 功 能 ， 单 击 选 中 
admin.asp 页 面 中 需要 重复 的 行 ， 如 网 $-77 所 示 。 




















{rs_admin. ID} {rs_admin. titlel} {rs_admin. timel 民 可 册 降 

















图 5-77 选择 重复 的 行 


单 击 “ 应 用 程序 ”和 面板 群 组 中 的 “服务 此 行为 ”和 面板， 并 在 面板 中 蛙 击 “增加 
服务 右 行 为 ”和 面板 中 的 加 写 “+” 控 钮 。 在 弹出 的 末 时 中， 选择 “重复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 8， 如 图 5-78 
所 示 。 

单 击 “ 确 定 ” 按 钮 回 到 编辑 页 耐 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 左 上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 图 5-79 所 示 。 


























新 闻 中 山 | 


ーー 























图 $-78 选择 记录 集 显示 的 记录 为 8 图 5-79 设 定 完成 的 效果 
接 下 来 要 在 admin.asp 中 加 入 “记录 集 导 航 条 ”功能 ， 使 系统 可 以 分 页 显示 所 


有 新 闻 。 鼠 标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 
中 的 “记录 集 导航 条 ”按钮 如， 单 击 “确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 页 面 出 现 该 记录 




















记录 集 写 肌 条 











{rs admin. IDN} {rs_admin. title} {rs_admin. timel ”个 改 删除 
加 果 术 :如果 罕 :加 果 罕 :如 果 符 合 此 条 件 则 显示 ... 

































接着 要 插入 “记录 集 导航 状态 ”把 鼠标 移 至 要 加 入 “记录 集 导 航 状态 ”的 位 
置 ， 单 击 “插入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导航 状态 ”按钮 刚 ， 打 开 “ 记 录 集 
导航 状态 ”对 话 框 ， 在 “记录 集 ” 下 拉 列 表 中 选择 rs_admin， 再 单 击 “ 确 定 ” 按 钮 回 到 编辑 
页 面 ， 将 发 现 页 面 中 目 动 插入 记录 集 导 航 状 态 ， 如 图 $-81 所 示 。 


记 承 集 号 肌 状 态 























frs_ admin.titlsi rs_admin. timei 惧 改 删 际 
































图 5-81 插入 “记录 集 导航 状态 ” 











admin.asp 页 面 主要 是 使 管理 者 能 够 链接 全 编辑 页 面 ， 并 对 新 闻 进 行 新 增 、 修 
改 与 删除 等 操作 。 因 此 需要 在 网 员 中 加 入 说明 文字 让 管理 者 能 方便 地 进入 相应 的 页 面 进 行 管 
理 ， 设 计 这 个 页 面 的 4 个 连接 如 下 : 

@ 标题 字段 {rs admin.title} 链 接 的 对 象 为 newscontent.asp: 

@“ 新 增 新 闻 ” 文 学 链接 的 对 象 为 news add.asp 























秆 5 音 全 曾 司 荐 :7 





@“ 人 修改” 文字 链接 的 对 象 为 news_upd.asp 
@“ 有 删除” 文字 链接 的 对 象 为 news del.asp 


首先 选中 “新 增 新 闻 ”， 在 “属性 ”面板 中 将 它 连接 到 news 文件 夹 中 的 SN 





news add.asp 负面 ， 如 图 5-82 所 示 。 
愉 Tt rr = し 
| 1THL | 燈 式 ) | 段 w | 类 = 





B33 





图 $-82 ”指定 “新 增 新 闻 ” 的 链接 


选中 “修改 ”文字 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 
“+” 按 钮 ， 在 弹出 的 染 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 

打开 “ 转 到 详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ” 按 钮 打开 “选择 文件 ”对 话 框 ， 
选择 news 文件 夹 中 的 /news/news_upd.asp， 其 他 设 定 值 皆 不 改变 其 默认 值 ， 如 图 $-83 所 示 。 





链接 : | 所 选 范 围 : “修改 
详细 信息 页 : |/news/news_upd. asp 





设置 为 以 下 项 的 值 


v 





传递 URL 参 数 : ID 














列 : Tn vy 
传递 现 有 参数 : [] mr 参数 
表单 参数 








图 5-83 “修改 ”文字 的 “ 转 到 详细 页 面 ” 对 话 框 设置 


选中 “删除 ”文子 并 重复 上 和 耐 的 操作 ， 要 转 到 的 详细 信息 页 为 /news/news_ 


delasp， 如 图 5-84 所 示 。 


链接 :| 所 选 范围 :“ 册 除 ” 
详细 信息 页 : |/news/news_del. asp 





| 设置 为 以 下 项 的 值 


ww 


传递 URL 参 数 : ID 
记录 集 : rs_admin 











列 : ID v 





传递 现 有 参数 : [ ] WRL 参数 
[表单 参数 





图 5-84 “删除 ”文字 的 “ 转 到 详细 页 面 ” 对 话 框 设置 





再 选中 标题 字段 frs_admin.title} 并 重复 上 面 的 操作 ， 将 “详细 信息 页 ”设置 为 
/news/newscontent.asp， 如 图 5-85 所 示 。 








-二 
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链接 : | 所 选 范围 : "<%= (rs_admin. Field: ~ 
详细 信息 页 : | news/newscontent. asp | 人 症 .| 


传递 URL 参 数 : ID ”设置 为 以 下 项 的 值 




















记录 集 ranin oo {tt 


列 : Tn v | 
传递 现 有 参数 : [ ] yRL 参数 
[表单 参数 











5-85 {rs_admin.title} 学 段 的 “ 转 到 详细 页 面 ” 对 话 框 设置 


百合 管理 只 有 管理 人 员 输 入 正确 的 账号 与 密码 才 可 以 进入 ， 所 以 对 本 页 的 访问 
功能 必须 设置 限制 。 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 
在 弹出 的 菜单 列表 中 ， 选 择 “ 用 户 喘 份 验证 /限制 对 页 的 访问 ”的 选项 。 

在 打开 的 “限制 对 页 的 访问 ”对 话 框 中 选择 “用 户 名 的 密码 ” 蛙 选 授 钮 ， 在 
“如 果 访 问 被 拒绝 ， 则 转 到 ”文本 框 中 输入 ../index.asp， 表 示 如 果 访 问 被 拒绝 则 转 到 首页 ， 设 
置 如 网 5-86 所 示 。 























〇 ”用 户 各、 密码 和 访问 级 别 





选 职 级 别 : ーー 


如 果 访 问 被 拒绝 ， 则 转 到 : |. . /index. asp 























图 5-86 设置 “限制 对 页 的 访问 ”对 话 框 


至 此 ， 系 统管 理 后 台 主 页 面 admin.asp 的 设计 与 制作 已 经 完成 ， 从 后 台 登 录 后 
预览 制作 效果 ， 如 图 5-87 所 示 。 
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图 5-87 管理 页 面 效果 图 




















本 节 将 介绍 如 何 制作 新 增 新 闻 的 页 面 news add.asp， 访 页 面 主要 的 功 


数据 增加 到 网 站 的 数据 库 中 ， 页 面 设计 如 图 5-88 所 示 。 
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图 5-88 ”新 增 新 闻 页 面 
评 细 操作 步 又 如 下 : 





是 将 页 面 的 表单 ウー 


uid ロニ 


在 news add.asp 编辑 页 面 中 ， 执 行 菜单 栏 中 的 “窗口 ”一 “服务 器 行为 ” 命 
令 ， 打 开 “ 服 务 器 行为 ”面板 。 单 击 该 面板 中 的 “+” 号 按钮 ， 从 打开 的 菜 时 中 选择 “插入 


记录 ”命令 ， 同 该 网 页 搬入 记录 的 服务 融 行 为 。 
打开 “插入 记录 ”对 话 框 ， 按 下 面 的 参数 进 4 





FE 
插入 到 表格 : 

AL |[」 
获 职 值 自 : | Eorm1 [在 提 变 时 ) 


title A title' Cr 本 ) 
E 中 “content" 【了 本 ) 








mu < 
提 变 为 : 文本 











$-89 ” 设 定 “插入 记录 ”对 话 框 

@ 从 “连接 ”下 拉 列 表 中 选择 news 连接 对 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 news 数据 表 

@ 在 “插入 后 ， 转 到 :” 栏 中 输入 admin.asp， 表 示 揪 入 成 功 后 返回 该 页 面 。 











行 设置 ， 如 图 $-89 所 示 。 
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@ 从 “获取 值 目 ”下 拉 末 单 中 选择 建 并 的 forml 表单 对 象 。 

@ 在 “表单 元 素 ” 列 表 框 中 把 表单 中 的 字段 和 数据 库 中 的 字段 一 一 对 应 。 

单 击 “ 确 定 ” 投 钮 回 到 编辑 页 面 ， 则 完成 news_add.asp 页 面 插入 记录 的 设计 ， 
效果 如 网 5-90 所 示 。 
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東上 修改 新 闻 页 面 


设计 修改 新 闻 的 页 面 news_updasp， 这 个 页 面 的 主要 功能 是 将 数据 库 的 现 有 数据 达到 页 
面 的 窗口 进行 修改 ， 修 改 数据 后 再 更 独到 站 点 的 数据 库 中 。 页 面 设计 如 图 5-91 所 示 。 
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5-91 修改 新 闻 页 面 
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评 细 操作 步 又 如 下 : 

打开 news upd.asp 页 面 ， 单 击 “ 绑 定 ” 面 板 ， 并 在 面板 中 单 击 “增加 绑 定 ” 
按钮 “+”， 在 弹出 的 采 单 中 ， 选 择 “ 记 录 集 (但 询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参 
数 进行 议 置 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 ， 如 网 






























































$-92 所 示 。 连接 ー 
@ 在 “名 称 ” 文 本 框 中 输入 rs upd 作为 该 | 2 
记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 
连接 对 象 。 
@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 
库 表 对 象 为 news。 
@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按 
旬 。 图 5-92 设 定 rs_upd“ 记 录 集 ”对 话 框 


@ 设置 “ 沛 选 ” 有 的 条 件 为 “ID=URL 参数 有 D”。 

@ 在 “排序 ”下 拉 末 单 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 

绑 定 记录 集 后 ， 将 记录 集中 的 {rs upd.title} 和 (rs upd.content} 字段 插入 至 
news upd.asp 网 页 的 适当 位 置 ， 如 图 5-93 所 示 。 


DV 文 弟 中 而 组 2) 查看 [y) 装 入 ) 禁忌 人 W) 格式 0) 人 名 生 CC) 站 点 仔 ) 田口 W) 帮助 00) br x | 








人 ms wp sirle csr 
| 野人 | やけ | 5 は 代 8 に て 。 因 抽 田 」、 必 策 。 本 忆 、 口 。。 于 是 ， 届 加 5 俯 


(coatiat) 


ne 


EO 


MT 


人 


类 于 (7 单行 5) 〇 ま 生 上 OEY 

Wi 人 = (rs upd Finids Timm{ econtent ¥ 
RAO 
DR 








本 TH BR SE CE 





图 5-93 ”字段 的 搬入 


完成 表单 布置 后 ， 要 在 news upd.asp 页 面 中 加 入 “服务 器 行为 ”中 “更 新 记 
录 ” 功 能 ， 在 news upd.asp 页 面 中 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 
写 “ 二 ”按钮 。 在 弹出 的 菜单 列表 中 选择 “更 新 记录 ”选项 。 

在 “更 新 记录 ”对 话 框 中 ， 按 下 面 参数 进行 设置 ， 如 图 5-94 所 示 。 

@ 从 “连接 ”下 拉 来 单 中 选择 news 连接 对 象 。 
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设 定 “更 新 记录 ”对 话 框 


@ 从 “要 更 新 的 表格 ”下 拉 列 表 中 选择 news 数据 表 。 
@ 从 “获取 记录 目 ” 下 拉 束 单 中 选择 建立 的 rs_upd 记录 集 。 
@ 从 “唯一 键 列 ”下 拉 列 表 中 选择 ID， 并 单 击 选择 “数值 ” 复 选 框 。 








@ 在 “在 更 新 后 ， 转 到 : ” 栏 中 输入 .Vindex.asp， 表 示 插 入 成 功 后 返回 该 页 面 。 
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@ 从 “获取 值 目 ”下 拉 列 表 中 选择 建立 的 forml 表 単 対象 。 
@ 在 “表单 元 系 ” 列 表 框 中 把 表单 中 的 字段 和 数据 库 中 的 字段 一 一 对 应 。 
单 击 “确定 ”按钮 加 到 编辑 页 面 后 ， 即 完成 设 定 ， 如 图 5-95 所 示 。 
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图 5-95 ”加 入 更 新 记录 后 的 效果 








最 后 介绍 用 于 删除 新 闻 的 页 面 news_delasp， 该 页面 的 界面 和 修改 新 闻 的 页 面 震 不 多 ， 
只 是 其 功能 是 将 表单 中 的 数据 从 站 点 的 数据 库 中 删除 。 
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删除 新 闻 页 面 如 图 5-96 所 示 。 
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图 5-96 ”删除 页 面 的 设计 


许 细 操作 步骤 如 下 : 

打开 news delasp 页 面 ， 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 荣 
单 中 选择 “记录 集 (查询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 投 钮 完成 设 定 ， 
如 图 5-97 所 示 。 

@ 在 “名 称 ” 文 本 框 中 输入 rs_del 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 源 连接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 设置 “ 沛 选 ” 的 条 件 为 “ID=URL 参数 /ID”。 

@ 在 “排序 ”下 拉 菜 单 中 选择 “ID” 选 项 ， 然 后 选择 “降序 ”的 排列 顺序 。 
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图 5-97 设 定 rs_del 记录 集 
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绑 定 记录 和 集 后 ， 将 记录 集 的 字段 插入 全 news del.asp 网 页 的 适当 位 置 ， 如 图 
5-98 所 示 。 
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图 5-98 ”字段 的 插入 








完成 表单 的 布置 后 ， 要 在 news delasp 负面 中 加 入 “服务 器 行为 ”中 的 “删除 
记录 ”功能 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 “+” 号 按钮 。 在 弹出 的 
及 单列 表 中 ， 选 择 “ 删 除 记 录 ” 选 项 。 

打开 “删除 记录 ”对 话 框 ， 根 据 下 面 的 参数 进行 设置 : 

@ 从 “连接 ”下 拉 列 表 中 选择 news 数据 产 连 接 对 象 。 

@ 从 “从 表格 中 删除 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 news。 

@ 从 “选取 记录 目 ” 下 拉 列 表 中 ， 选 择 rs_del 记录 集 。 

@ 从 “唯一 键 列 ”下 拉 列 表 中 选择 ID 字段 ， 并 单 击 选择 “数值 ” 复 选 杠 。 

@ 在 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 forml 表单 。 

@ 在 “删除 后 ， 转 到 ”文本 框 中 输入 删除 后 转 到 的 页 面 为 .Jindex.asp。 

完成 设置 的 对 话 框 如 图 5-99 所 示 。 
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$-99 ” 设 定 “删除 记录 ”对 话 框 
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单 击 “ 硝 定 ” 按 钮 回 到 编辑 页 面 ， 即 完成 删除 新 闻 页 面 的 制作 如 网 $-100 
所 示 。 











© 








动 江 文 素 天 (title) 
融 咒 廊 市 十 (csntsnu) 





1 年 本 欄 項 





图 5-100 “删除 记录 效果 图 
全 此 ， 则 完成 了 整个 新 闻 系 统 的 制作 。 














线 投票 系统 也 是 网 站 最 第 用 的 系 
统 之 一 。 网 站 可 以 通过 网 站 在 线 投票 功 
能 做 一 些 调 但 工作 。 本 章 将 详细 介绍 网 


a 该 系统 用 直观 的 图 形 
化 界面 显示 投票 信息 ， 以 及 即时 查看 投 
票 情况 等 技术 。 实 例 中 的 技术 核心 在 于 
使用 ASP 编写 程序 实现 投票 累加 的 方 
法 和 使 用 ASP 编写 程序 实现 图 形 化 显 
示 投 票 结果 的 方法 。 


了 到 








教学 重点 


投票 系统 的 规划 与 设计 に 
投票 系统 数据 库 的 设计 連 
投票 动态 页 面 的 开发 に 
计算 投票 的 方法 7 
显示 投票 结果 的 设计 に 
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搭建 投票 系统 开发 平台 





投票 系统 一 般 应 用 于 大 型 的 动态 网 站 ， 在 网 站 的 首页 单独 列 出 一 个 模块 用 于 用 户 登 录 使 
用 ， 因 此 开发 在 线 投票 系统 首先 要 制作 相关 的 静态 网 页 效果 。 投 票 系统 在 网 站 首页 的 位 置 如 
图 6-1 所 示 。 

















6-1 投票 系统 在 网 站 首页 的 位 置 


在 设计 的 过 程 中 首页 的 布局 需要 以 下 儿 个 环 方 : 建立 本 实例 的 站 点 chap06, 使用 
Photoshop 分 割 图 片 ， 配 置 IS 站 点 浏览 ， 使 用 div+CSS 布局 静态 页 面 。 


6.1.1 使用 Photoshop CS5 分 割 園 片 














下 面 束 开始 用 Photoshop CSS 切片 工具 分 割 首页 图 片 。 

站 和 完 在 本 地 计算 机 D 盘 建 立 站 点 文件 夹 chap06， 在 站 点 文件 夹 里 建立 一 些 常 
用 文件 夹 如 css、images、psd 文件 夹 。 然 后 从 交往 中 找到 站 点 chap06/psd 文件 来 下 的 
index.psd 文件 ， 将 其 复制 到 本 地 站 点 psd 文件 来 中 。 

启动 Photoshop CS5， 选 择 菜 单 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开 首 页 
index.psd 文件 ， 可 分 割 的 效果 如 图 6-2 所 示 。 

井 始 分 割 各部 分 圏 片 , 首 先 分 割 最上 面 的 Logo 所 在 行 的 图 片 ， 单 击 工 具 箱 中 
的 “切片 工具 ”按钮 | 和 襄 ， 单 击 鼠 标 左 键 从 场景 的 左上 角 拖 中 到 标题 的 右 下 角 ， 如 图 6-3 所 
示 ， 图 中 绘制 的 虚线 框 就 是 切片 大 小 ， 切 片 后 左上 角 会 显示 一 个 国 国 图 标 。 

保持 “切片 工具 ”按钮 | 加 选中 状态 ， 按 下 快捷 键 〈《Ctl+H》 组 合 键 ， 打 开 辅 助 
线 视图 ， 可 以 先 用 辅助 线 分 割 好 需要 分 割 的 区 域 ， 按 照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 9 
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个 小 图 片 ， 如 图 6-4 所 示 。 
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图 6-3 Logo 部 分 的 切片 效果 
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6-4 切片 整个 首页 的 效果 


选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “が 散 ” 模式 , 
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“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 6-$ 所 示 。 
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“存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “ 储 存 ” 控 钮 打开“ 将 优化 结果 存储 为 ”对 话 框 ， 蛙 击 选 择 “ 你 存 
在 ” 右 侧 的 下 拉 三 角 按 钮 ”， 选 择 建立 的 chap06 文件 来， 其 他 参数 保持 默认 值 ， 如 图 6-6 


所 示 。 


将 优化 结果 存 博 为 
保存 在 I): | DB chsp06 








| images 
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index. html 


HTML 和 図 像 Gt.html) マ 


文件 名 ) : 
保存 类 型 て ) : 














设置 : 默认 设置 マ 
切片 : 选中 的 切片 マ 











6-6 “将 优化 结 朱 存储 为 ”对 话 框 设 置 


保存 ⑤) 
取消 


单 击 “保存 ”按钮 ， 完 成 保存 切片 的 操作 。 打 开 文件 傈 存 的 路 径 ， 可 以 看 到 目 
动 生成 了 一 个 名 为 images 的 文件 来 ， 文 件 夹 里 古 前 面 切 片 后 产生 的 小 图 片 ， 由 这 些小 图 片 
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组 成 了 首页 的 效果 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 6-7 所 示 。 
。 5 
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回 图 片 收 训 
3 我 的 电脑 
3 网 上 邻居 


index_09. jpg 





6-7 分 割 后 的 小 图 片 


利用 配置 投票 系统 站 点 服务 器 


使用 IIS 在 本 地 计算 机 上 构建 投票 系统 网 站 的 站 点 ， 配 置 步 又 如 下 : 

首先 启动 IS， 在 IS 窗口 中 ， 用 鼠标 右键 单 击 “ 默 认 网 站 ” 选择 菜单 中 的 
“属性 ”命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 6-8 所 示 。 

单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 人 径 ” 文 本 框 中 设置 站 点 文件 夹 路 径 为 
“Di\chap06”， 其 他 参数 保持 默认 值 ， 设 置 如 图 6-9 所 示 。 


点 认 网 站 属性 
网 站 | ISAPI 筛选 器 | 主 目录 | 文档 “| 目录 安全 性 | TTF 头 ‖ 自 定义 错误 | ) 目录 安全 性 | TTF 头 | 自 定 尺 错误 
网 站 标识 连接 到 资源 时 的 内 容 来 源 : 
描述 @) : TT TE | @ 此 计算 机 上 的 目录 四] 
〇 另 一 台 计 算 机 上 的 共享 (8) 

人 〇 重定 向 到 URL⑪ 
TCF 端 口 (T): 0 | GT 

本 地 路 径 (C): D: chapnB 


连接 口 脚本 资源 访问 ) 加 记录 访问 久 ) 
连接 超时 WI) : gnn | 种 读 取 GR) 索引 資源 ) 


保持 ITTE 连接 (K) 疯 上 (B) 


启用 日 志 记 录 写 ) 应 用 程序 设置 
活动 日 志 格 式 ): 应 用 程序 名 他) : 默认 应 用 程序 册 | 除 是 ) 
W3C 扩展 日 志 交 件 格式 | 属性).… | om 开始 位 置 : < 加 让 网 站 > 
| = = _ - 配置 (G). . . 
执行 权限 企 ): 印 脚 本 v 
应 用 程序 保护 他) : 中 (共用 ) 年 D 载 (L) 






















































































6-8 “默认 网 站 属性 ”对 话 框 6-9 设置 网 站 的 “本 地 路 径 ” 
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单 击 “ 人 确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 设置 ， 由 于 前 和 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 正 浏览 器 输入 地 
址 http://]127.0.0.1， 即 可 簿 看 页 面 分 割 后 的 效 素 。 如 果 可 以 浏览 到 Photoshop CSS 切片 后 的 
网 页 效果 ， 说 明 站 点 服务 器 配置 已 经 完成 。 


0 创建 编辑 站 点 chap06 : 


使用 Dreamweaver CS5 进行 网 页 布局 设计 ， 首 先 需 要 用 定义 站 点 问 寻 定义 站 点 ， 操 作 步 
又 如 下 : 

打开 Dreamweaver CSS$， 选 择 菜 单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 
“管理 站 点 ”对 话 框 。 

单 击 右边 的 “新 建 ” 按 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ” 对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ”_ chap06。 

“本 地 站 点 文件 夹 ” D:\chap06\。 

如 图 6-10 所 示 。 

单 击 “分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 器 名 称 ” chap06。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ”，D:chap06。 

“Web URL": http://127.0.0.1 。 

设置 后 的 “服务 器 ”的 参数 如 图 6-11 所 示 。 


站 点 设置 对 和 锣 chap06 


站 全 Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweawer 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文件 的 计算 机 上 的 本 地 文件 
版 直人 SE 寺村 中 将 相同 文件 发 布 到 web 上 的 服务 器 上 的 远程 文件 支 。 
= 局 














您 可 以 在 此 处 为 Dreamweayer 站 点 选择 本 地 文件 夹 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 夹 : = 





图 6-10 设置 站 点 对 话 框 


“测试 服务 器 文件 ”Di\chap06\。 
“URL 前 级 ”: http://127.0.0.1。 
配置 如 图 6-11 所 示 。 











人 


版 本 控制 服务 器 名 称 :ra | 
* ”高 级 设置 
连接 方法 ;| 本 地 | 网 络 iv 
服务 器 文人 天 :bai | 各 
Web URL 











6-11 “服务 器 ”选项 卡 的 参数 设置 


单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 此 时 ， 在 Dreamweaver CSS 中 已 经 
拥有 了 刚才 设置 的 站 点 chap06。 
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6-12 整体 布局 设计 
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使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 修 改 为 标准 的 ASP 文档 格式 ， 将 
</head> 以 上 的 代码 优化 为 如 下 代码 : 


<IDOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/EN" "http://www.w3. 
org/ TR/xhtmll/DTD/xhtmll-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet" href="css/style.css" type="text/css"/> 

<title> 上 度假 村 </title> 


其 他 div 的 布局 代码 如 下 : 


<body> 

<div id="top "> 

<div id="logo"><img Src= /images/Iindex 01.jpg"></div> 

<div 1d="banner"> 

<div class="banner1"><a href="#"> 首 誠に 7a> <a hre 伍 #"> 景 点 地 图 |</a> <a hre 伍 "#"> 留 言 咨询 
</a></div> 

<div class="banner2"><a hre 伍 "#"> 前 ”页 </a>/<a hre 伍 "#"> 景 点 推荐 </a>/<a hre 伍 "#"> 团 队 活 动 
</a>/<a hre 仁 /vote.asp"> 有 再 线 投票 </a>/<a hre 伍 "#"> 娱 乐 项 目 </a>/<a hre 伍 "#"> 交 通路 线 </a></div> 

</div> 

</div> 

<div id="mid"> 

<div 1d="zhuce"> 

<div class="username"> 用 所 名 : 

<input name="textfield" type="text" 1d="textfield" size="10" /> 

</div> 

<div class 

</div> 

</div> 


<div id="news"> 


="password"> 蜜 何 : <input name="textfield2" type="text" id="textfield2" size="10" /> 


<div class="news"> 

<a href="#">2008 年 北京 后 花园 旅游 风景 区 台历 [2008-05-02]</a> <a 
hre 伍 #"> 目 然 风 光一 日 游 :65 元 一 一 75 元 /位 

[2008-03-25]</a> ”<a href 人 ="#"> 浪 漫 山 谷 风 情 交 两 日 游 288 元 /位 

[2008-04-12]</a> ”<a hre 伍 #"> 打 起 鼓 来 敲 起 勉 唆 ! ! 

[2008-06-01]</a> ”<a hre 伍 "#"> 沙 滩 活动 -- 美 丽 的 意外 

[2008-08-08]</a></div> 

</div> 


<div 1d="video"><1img src="/images/index 05.jpg"></div> 











<div id="]jingshen "><img src="/1mages/index 06.jpg"></div> 

<div id="quick"><img src="/1mages/index 07.jpg"></div> 

<div 1d= "touplao"><a href="/vote.asp"><img src="/images/index 08.jpg"></a></div> 
</div> 
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<div 1d="bottom"> 
<div 1d= "copyrlght"><lmg src="/images/index 09.jpg" /></div> 
</div> 


</body> 会 


将 制作 的 网 页 布局 文件 保存 为 index.asp 页 面 。 
在 站 点 中 建立 CSS 文件 夹 ， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控 
制 代码 如 下 : 


パパ 页 面 整 体 CSS*/ 


*{ margin:Opx; 





padding:Opx:! 

body{ width: 100%; height: 100%; font-size:12px: background:#FFFFFF;} 
此 设置 幢 面 链接 */ 
a:link { 

color: #000000; 

text-decoration: none: 
} 
a:visited { 

text-decoration: none: 

color:#666666; 
} 
a:hover { 

text-decoration: underhne: 

color: #FF9900: 
} 
a:active { 

text-decoration: none; 

color: #000000: 
} 
な 设置 所 有 图 厂 的 边框 为 0*/ 
img { 

border: 0;} 
な 设置 最 外 层 居 中 显示 ， 实 现 让 整个 页面 居中 显示 */ 
#top,#mid,#bottom{ margin:auto; 

width:998px;} 

な 设置 左 浮动 的 标签 党 
#logo,#banner,#zhuce,#news,#video, 























#jlmngshen,#qulck#toupiao1 float:left; + 
/*top 部 分 */ 
#banner{ width:759px: 

height:106px: 

background-image:url(/1images/index 02.gif);} 
.bannerl 1 width:165px: 
height: 1 Spx; 
margin-top:4px; 
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margin-left:543px:) 

.bannerl a:hnk { 
color: #000000: 
text-decoration: none: 

} 

.bannerl a:visited { 
text-decoration: none: 
color:#FFF; 

} 

.bannerl a:hover { 
text-decoration: underhne: 
color: #FF9900; 

} 

.bannerl a:active { 
text-decoration: none: 
color: #000000; 

) 

.banner21 width:300px: 

height:20px: 
margin-top: 18px; 
margin-left: 170px; 
font-size: 18px; 
font-weight:bolder; ¥ 

.banner2 a:link { 
color: #000000; 
text-decoration: none: 

} 

.banner2 a:visited { 
text-decoration: none: 
color:#FFF; 

) 

.banner2 a:hover { 
text-decoration: underhne: 
color: #FF9900; 

} 

.banner2 a:active { 
text-decoration: none; 
color: #000000: 

) 

/*mid 部 分 */ 

#zhuce{ width:239px: 

height:187px: 
background-image:url(mages/ndex 03.g1f);} 

.username{ width:150px: 

height: 1 Spx; 
margin-left:Spx; 
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margin-top:38px; 
color:#e716f9・ 


.Dassword1 width:150px: 
height: 1 Spx; 
margin-left:Spx; 
margin-top:8pxX; 
color:#e7f6f9;} 
#news{ width:453px: 
height:187px: 
background-image:url(/1mages/index 04.jpg):! 
.news{ width:385px: 
height:97px: 
margin-left:49px: 
margin-top:44px; 
line-height:20px;} 


投票 系统 的 脐 态 负面 效果 即 页 面 布局 已 经 完成 ， 本 实例 中 痛 页 的 布局 和 其 他 二 级 页面 的 
结构 基本 一 样 ， 二 级 负面 的 布局 样式 单独 写成 了 CSS 文件 夹 中 的 style2.css 文件 ， 读 者 可 以 
打开 光盘 中 的 相应 文件 浏览 参考 使 用 。 


投票 系统 规划 


本 广 将 介绍 使 用 Access 建立 数据 库 和 数据 表 的 方法 ， 同 时 介绍 投票 系统 数据 库 的 连接 
方法 ， 投 票 系统 的 数据 库 主要 用 来 存储 投票 选项 和 投 佘 次 数 。 


也 系统 页 面 规划 


对 投票 系统 来 说 可 以 分 为 3 个 部 分 ， 一 个 是 计算 投票 页 面 ， 一 个 是 显示 投票 结果 页 面 ， 
另外 一 个 是 用 来 提供 选择 投票 选项 的 页 面 。 投 票 系统 总 共有 3 个 页 面 分 别 为 开始 投票 页 面 、 
计算 投票 页 面 和 投票 成 功 显 示 投 票 结 采 页 和 面 。 系 统 页 面 的 功能 与 文件 名 如 下 。 

Dy index.asp: 投票 系统 网 站 的 首页 。 

較 Vote.asp: 开始 进行 投票 的 页 面 。 

Du voteadd.asp: 计算 投票 效果 并 增加 记录 的 页 面 。 
Du voteok.asp: 图 形 化 显示 投票 结果 的 页 面 。 


了 数据 库 设 计 


投票 系统 需要 一 个 用 来 存储 投票 选项 和 投票 次 数 的 数据 表 vote。 投 票 信息 数据 表 vote 的 
字段 结构 采用 表 6-1 所 示 的 结构 。 数 据 库 设计 的 步 又 如 下 : 




































































2 






中 


表 6-1 投票 信息 数据 表 vote 


在 Microsoft Access 2007 中 实现 数据 库 的 搭建 ， 首 先 运 行 Microsoft Access 





状 认 值 
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2007 程 序 。 単 市 “空白 数 据 訂 ” 接 邊 =-, 在 主 界面 的 右側 打電 “空白 数 据 訂 ? 面板 , 如 関 


6-13 所 示 。 





[i 
ED Microesoft Office Access 
Emr ュ 
Ed 上 EE も コ 
转 色 联 横 蜂 硬 
| 
| 
| 室 自 点 把 库 
TE rt 
| 变 和 件 名 曾 ] 
ゴロ 『 は 1 トド | 加 
Ei Deemanis vir を mtiisEi bel [ha em fi 5 
。 。 i Le | | 取 而 
画 三 | | 
本 | 下 而 





图 6-13 打开 的 空白 数据 库 面 板 


单 击 “ 空 白 数据 库 ” 面板 中 的 “浏览 到 某 个 位 置 来 存放 数据 库 ” 按钮 名 
开 “ 文 件 新 建 数据 库 ” 对 话 框 ， 在 “保存 位 置 ” 后 面 的 下 拉 列 表 中 选择 站 点 chap06 文件 














中 的 mdb 文件 夹 中 ， 在 “文件 名 ”文本 框 中 输入 文件 名 vote， 如 图 6-14 所 示 。 


保存 位 置 て ): 
办 我 最 ii 的 文档 
BE 
图 我 的 文档 

4 我 的 电脑 
\ 同上 人 居 











DD nab 








文件 名  : - |vote.m 





保存 类 型 て ) : | 1croso 


图 6-14 设置 “文件 新 建 数据 库 ” 对 话 框 





， 打 














単 市 “ 砂 定 ” 接 哲 , 返 回 “空白 数 据 麻 ” 面板 , 再 単 訓 “空白 数 指 麻 ” 面板 中 
的 “创建 ”按钮 ， 即 在 Microsoft Access 2007 中 创建 了 votemdb 数据 库 ， 同 时 Microsoft 
Access 2007 目 动 生 成 了 一 个 “ 表 1: 表 ” 数 据 表 ， 用 鼠标 右键 单 击 选 择 “ 表 1: 表 ” 数 据 





表 ， 打 开 快捷 菜单 ， 执 行 快捷 菜单 中 的 “设计 视图 ”命令 ， 如 图 6-15 所 示 。 
CO に oe ーー っ vote : 本 昌 雇 TAcreis 2002 - 2004 宰相 本 本 ) 。 MicTnsG RE ーー 
ke | 国 8 5 a 8 = a 是 

| Ra ーー ao ド レコ ヨコ 
| sm Et Ee E | 
| ms ET ね WP 
FT In 
本 是 日 上 [eg 
| | 町 用 
細 二 寺 太 本 } | 
SR 
ET i 
名 村 限于 旧作 和 二 本 民 卫 要 曾 :1| 
| | 
开 归 坦 吊 绊 汪 [HI 
到 二 LI) 
衣着 殺 上 
a Wi 
-Eg 
ーー EE TE TY EE ] 





图 6-15 打开 的 快捷 亲 单 命令 


执行 快捷 菜单 中 的 “设计 视图 ”命令 ,打开 
“另存 为 ”对 话 框 ， 在 “ 表 名 称 ” 文 本 框 中 输入 数据 表 名 称 
vote, a 6-16 所 示 。 

单 击 “ 确 定 ” 按 钮 ， 即 在 “所 有 表 ” 列 表 框 中 
建立 了 vote 数据 表 ， 接 下 来 按 表 6-1 输入 字段 名 并 设置 其  ，。，。，， 
属性 ， 完 成 后 如 图 6-17 所 示 。 图 6-16 设置 “ 表 名 称 ” 为 vote 











[uu » 





字段 恒 性 


字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 


Fl 键 可 查看 有 关 字 段 名 称 的 示 助 。 








6-17 创建 vote 数据 表 的 字段 
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双 市 “ote: 泰 ， 打 开 vote 的 数据 表 ， 为 了 预览 方便 ， 可 以 在 数据 库 中 预先 添 
加 一 些 投票 内 容 所 为 数据 ， 如 图 6-18 所 示 。 





表 工 具 
外 部 数据 数据 库 械 具 数 握 表 


中 文 简 繁 转换 


x 








itenm 
国 vote: 表 由 户外 虎 烧 
2 漂流 话 动 
3 自助 打 浇 
4 室内 游泳 
米 (新建 ) 
记录 : 4 《第 1 项 共 4 项 ，Mr | 到 

















图 6-18 vote 数据 表 中 的 输入 数据 
编辑 完成 ， 单 击 “ 保 存 ” 按 钮 回 ， 完 成 数据 库 的 创建 ， 最 后 关闭 Access 2007 软件 。 


江間 创建 数据 库 连接 


数据 库 创建 完成 后 ， 必 须 在 Dreamweaver CSS 中 建立 能 够 使 用 的 数据 源 连接 对 象 ， 这 样 
才能 在 动态 网 页 中 使 用 这 个 数据 库 文 件 。 接 下 来 将 介绍 在 Dreamweaver CSS 中 用 ODBC 连 
接 数 据 库 的 方法 ， 有 具体 的 连接 步骤 如 下 : 

执行 “控制 面板 ”一 “省 理工 具 ” 一 “数据 源 ODBC)” 一 “系统 DSN” 命 
今 , 打开 “ODBC 数据 源 管理 闫 ”对 话 框 中 的 “系统 DSN” 选 项 卡 ， 如 图 6-19 所 示 。 

在 “系统 DSN” 対策 権 中 単 市 “添加 (D)” 接 外 , 打 井 “ 倒 建 新 数 据 源 ” 
对 话 框 ， 在 打开 的 “创建 新 数据 源 ” 对 话 杠 中， 选择“Driver do Microsoft Access 
(*.mdb)” 选 项 。 

选择 “Driver do Microsoft Access〈(*.mdb)” 选 项 后 单 击 “ 完 成 ”按钮 。 打 开 
“ODBC Microsoft Access 安 装 ” 対策 椎 , 在 “数 据 源 名 (N)” 文 本 框 中 输入 vote， 如 图 6-20 
所 示 。 

を 10DBC 数 据 江 管理 回 


用 户 DSW 系统 DSH | 文件 DSW | 驱动 程序 | 跟踪 ”| 连接 池 | 关 于 | 
系统 数据 源 (8): 

















ODBC 了 icrosoft Access 安装 


数 据 源 名 ): ”| 加 本 
说 明 中): | 
数据 库 
数据 库 :了 D:\chap0B\mdb\wote. mdb 帮助 (KH) | 
选择 (8)... | 创建 C).… | 收复 (EE)... | 压缩 如 )... | Rs 


取消 


系统 数据 库 


* 无 还) 
个 数据 库 (1): 


Ei 选项 0) >> | 





图 6-20 ODBC Microsoft Access 设置 














EE 
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然后 单 击 “ 选 择 〈S$)” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 框 ， 单 击 “ 张 动 需 
(V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 站 ， 从 下 拉 菜 单 中 找到 创建 数据 库 步 又 中 保存 数据 库 的 文 
件 ， 然 后 再 在 左上 方 “ 数 据 库 名 “A)” 文 本 框 的 下 方 选择 数据 库 文 件 vote.mdb， 则 数据 库 名 
称 自动 添加 到 “数据 库 名 “(A)” 文本 框 中 ， 如 图 6-21 所 示 。 

找到 数据 库 后 ， 在 “选择 数据 库 ” 对 话 框 中 单 击 “ 确 定 ” 按 钮 ， 回 到 “ODBC 
Microsoft Access 安装 ”对 话 框 中 ， 再 次 单 击 “ 人 确定 ”按钮 ， 则 返回 到 “ODBC 数据 源 管 理 器 ” 
中 的 “系统 DSN” 选 项 卡 ， 则 可 以 看 到 “系统 数据 源 ” 中 已 丝 添加 了 一 个 名 称 为 vote 的 系统 
DNS， 张 动 程 序 为 “Driver do Microsoft Access (*.mdb)” 的 系统 数据 源 ， 如 图 6-22 所 示 。 

eoDpc 数据 源 管理 器 


用 户 nsm 系统 DSW | 文件 nsW| 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 (8): 














目录 I): 配置 (C).…. 
d: tchanHE mdb 


ODEC 系统 数据 源 存 娃 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
| ” 统 数 据 源 对 当前 机 器 上 的 所 有 用 户 可 见 ， 包 插 WT 服务 。 


立 件 从 型 了): 





图 6-21 选择 数据 库 文件 图 6-22 ODBC 数据 源 管理 器 
再 次 单 击 “ 确 定 ” 按 钮 ， 完 成 “ODBC 数据 源 管 理 器 ”中 “系统 DSN” 的 


设置 。 

局 动 Dreamweaver CSS， 设 置 好 “站 点 和“ 文档 ーーー 
类 型 ”和 “测试 服务 器 ”， 在 网 站 根 目 录 下 打开 index.asp 网 页 。 
执行 菜单 栏 中 的 “文件 ”一 “窗口 ”一 “数据 库 ” 命 令 ， 打 开 ”图 6-23 执行 “数据 源 名 称 
“数据 库 ” 面 板 ， 单 击 “ 数 据 库 ”面板 中 的 加 号 “+” 投 钮 ， 打 CDSN) ”命令 
开 下 拉 末 单 ， 在 下 拉 列 表 中 选择 “数据 源 名 称 (DSN)” 命 令 ， 如 图 6-23 所 示 。 

打开 “数据 源 名 称 (DSN)” 对 话 杠 ， 在 “连接 名 称 : ”文本 框 中 输入 connvote, 
单 击 “数据 源 名 称 (DSN): ”文本 框 右 侧 的 下 拉 三 角 按 钮 半 ， 从 打开 的 下 拉 沫 单 中 选择 在 
“数据 源 〈ODBC)” 一 “系统 DSN” 中 所 添加 的 vote， 其 他 保持 款 认 信 ， 如 图 6-24 所 示 。 


数据 源 名 称 (DSHR) 


























连接 名 称 : cornnmnvote 
数据 源 名 称 (DS: マ 
用 戸 名 : 





密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSN 
② 使 用 本 地 DSN 





图 6-24 数 据 源 名 称 (DSN) 
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单 击 “确定 ” 投 钮 ， 完 成 数据 库 的 连接 ， 同 时 在 网 站 根 目 孙 下 目 动 创建 一 个 名 
为 Connections 的 文件 来 , Connections 文件 夹 中 有 一 个 名 为 connvote.asp 的 文件 , 
connvote.asp 文件 可 以 用 记事 本 打开 ， 如 图 6-2 所 示 。 


外 connvote 一 記事 本 同 回 四 
文件 ) 编辑 应) 格式 Q) 查看 外) 和 帮助 0) 

K% 

' FileName="Connection _ odbc _ conn_dsn.htm" 
' Type="ADO" 

hated hate i "ADO" 

' HTTP=""Fa1s 

a 

”Schema=”” 

Dim MM connuvote STRING 

HM_connvote STRING = "dsn=vote;" 

る > 











6-25 用 记事 本 打开 connvote.asp 
人 至此， 数据 库 的 连接 操作 已 完成 。 


投票 系统 幢 面 设计 








对 投票 系统 来 说 主要 设计 的 页 面 是 投票 页 面 vote.asp 和 显示 结果 页 面 voteok.asp， 其 中 
陵 时 数据 库 中 的 数据 上 自动 增加 的 代码 是 在 voteadd.asp 页 面 中 实现 的 。 


人 < 投票 王 页 面 


制作 投票 页 面 vote.asp， 这 个 页 面 主 要 用 于 显示 投票 的 主题 和 投票 的 内 容 ， 让 网 站 浏览 
者 进行 投票 。 

具体 的 制作 步骤 如 下 : 

创建 vote.asp 页 面 在 文档 中 的 布局 效果 ， 即 页 面 的 静态 部 分 效果 如 图 6-26 所 示 。 


veap06Vwote sy (PL)* -Dx 
| CRD omote ep swe css | 

















と Sot pp | て MK ( | 


< | 
Ioedy> Givi dy VIDOR om vtR 7995v 9 F712 WK Gari" | 


6-26 插入 页 面 的 静态 部 分 效果 











各 系统 











执行 菜单 栏 中 的 “ 捅 入 ”一 “表单 ”一 “表单 ”命令 插入 一 个 表单 ， 再 执行 沫 
单 伴 “插入 ”一 “表单 ”一 “ 单 选 按 钮 ”命令 插入 一 个 单 选 近 钮 ， 选 中 单 选 按钮 并 在 “ 属 
性 ”面板 中 将 其 命名 为 “ID ”， 如 图 6-27 所 示 。 


の 








局 性 
口 | ee 定価 | | 。。 初 状 态 〇 已 选 台 类 回 | 元 加 | 
nm | 中 思 区 


图 6-27 设置 单 选 按钮 名 称 





在 第 一 行 中 输入 资 明 文字 “您 最 喜欢 的 度 ee ， 和 再 次 执行 荣 单 栏 中 的 
“插入 ”一 “表单 ”一 “按钮 ”命令 ， 插 入 两 个 按钮 ， 一 个 是 用 来 提交 表单 的 按 包 ， 邊 命名 
为 “投票 ”，” 男 外 一 个 是 用 来 合 看 投票 结 末 的 按钮 ， 侯 命 本 “ 合 看 ”， 设 莉 及 效 来 如 图 6-28 
所 示 。 


生計 








按钮 名 称 值 吧 ) 动作 上) 提 变 表单 外 ) 站 无 加 美 C) 
〇 得 设 表 单 四 


EE 
按钮 名 和 件 の 医者 。)。 | 动作 总 扣 克 表 单 &) O 元 の 美元 > 


加 重 设 表单 的 
DW 文件 全 储 强 记 王 看 (V) 凶 AG) 柳 介 ) 欄 式 0 命 C) 時 旧作 国 品 全。 帮助 (5 | | 克昌 后 天 改 滞 


し pnvetd, hp. yl ers 
Bi RB EE 古 還 系 
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图 6-28 设置 及 效果 图 
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开始 制作 动态 部 分 。 单 击 “ 绑 定 ” 面 板 中 的 “+” 号 按钮 ， 在 弹出 的 来 单 中 ， 
选择 “记录 集 (查询 )” 选 项 ， en “记录 集 ” 设 置 对话 框 ， 按 如 下 参数 进行 设置 ， 单 南 
“确定 ” 投 钮 完成 设 定 ， 如 图 6-29 所 示 。 2 
@ 在 “名 称 ” 文 本 框 中 输入 Rs 作为 该 记 
录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 connvote 
数据 源 连 接 对 象 。 
@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 
数据 库 表 对 象 为 vote。 
@ 在 “ 列 ” 选 项 栏 中 选择 “全 部 ” 单 选 
按钮 。 
@ 设置 “人 沛 选 ” 的 条 件 为 “无 ”。 
@ 设置 “排序 ”的 条 件 为 “无 ” 图 6-29 设 定 Rs 记录 集 
绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 什 vote.asp 网 页 的 适当 位 置 ， 如 图 6-30 
所 示 。 
























































TF ni い chap0e vote. asp (KHTML)* EEC 


世上 已 和 connvote. asp style2.css 














< 山 > 
<body> <divimnid> <div#tiao> <form#forml > <p> [wl|9 100% ~v|685 x 261v 92 K /2 秒 | 简体 中 六 (GB2312) 











图 6-30 ”记录 集 的 字段 插入 全 vote.asp 网 页 


单 击 选择 单 选 按钮 ， 将 字段 DD 插入 到 里 面 去 ， 插 入 后 以 在 单 选 按 钮 的 属性 面 
板 中 的 “ 逃 定信 ” 文 本 権 中 就 添加 了 搬 入 卫 字段 的 相应 代码 为 <%=(Rs.Fields. 
Item("ID").Value)%> 如 图 6-31 所 示 。 
RE er 














5) 单 选 按钮 选 定 值 <%= CRs. Fields. It | 初始 状态 〇 ① 巳 名 逃 (C) 美 C) 无 マ 
| m | [区 动态. 昌 未 渤 中 四 $ 


图 6-31 插入 字段 ID 到 单 选 按 钮 


由 于 vote.asp 页 面 将 显示 投票 选项 的 所 有 记录 ， 而 目前 的 设 定 则 只 能 显示 数据 
库 的 第 一 笔 数 据 ， 因 此 ， 需 要 加 入 “服务 喜 行 为 ”中 的 “重复 区 域 ” 命 令 ， 单 击 vote.asp 页 
面 中 的 行 ， 如 图 6-32 所 示 。 





























Bn: \chapoe\vote. asp (KHTML)* = 


NEA connvote. asp style2.css 





> 
body> <divimid> <div¥tiao? <form#forml > (Kp】 LE 685 x 261v 92KY72 秒 简体 中 娘 (682312)  : 





图 6-32 ”选择 要 重复 的 行 


再 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 喜 行 为 ”面板 ， 并 在 面板 中 单 击 “ 增 
加 服务 器 行为 ”中 的 “+” 按 钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ” 先 项， 打开“ 重复 区 
域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 “所 有 记录 ” 单 选 按钮 ， 如 图 6-33 所 示 。 





WE = っ つつ ~ 
OE 
② 所 有 记录 








图 6-33 ”设置 “重复 区 域 ” 对 话 框 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 堪 上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 此 时 的 效果 如 图 6-34 所 示 。 


DW 文 作 ) 访 提 (2) 吉普 (Y) 手 入 (I) 情 训 加) 格式 名 ) 例证 红 ) 站 点 全) 姜 口 (fT) 情動 OO | | it 7 lol 
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| 邊 昌江 性 .. eR 








1 个 术 霹 项目 社 启 中 , 总共 2520 [BE 」 


图 6-34 重复 区 域 后 的 效 末 
在 vote.asp 页 面 中 ， 在 “标签 选择 器 ”中 单 击 <from> 标 签 ， 并 在 “属性 ”面板 
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中 设置 表单 “ffom1” 的 “动作 ”为 设置 投票 数据 增加 的 页 面 /voteaddasp 。“ 方 法 ”为 
POST， 如 图 6-35 所 示 。 


RE 





| 表单 wcotsdep |] 癌 BB 本 | 网 
ー rr 本 al = 


6-35 ”设置 表单 动作 





选择 页 面 中 的 “ 答 看 ”按钮 ， 选 择 “ 标 签 <inpu 人 ”面板 ， 单 击 “ 行 为 ”面板 
中 的 加 号 “+” 投 钮 ， 在 弹出 的 列表 选项 中 选择 “ 转 到 URL ”命令 。 

在 打开 的 “ 转 到 URL” 对 话 框 中 ， 在 “URL” 文 本 框 中 输入 要 转 到 的 文件 
“voteok.asp” 如 图 6-36 所 示 。 





图 6-36 输入 转 到 URL 的 文件 地 址 
单 击 “ 确 定 ” 按 钮 ， 完 成 转 到 URL 的 设置 ， 此 时 的 “行为 ”面板 如 图 6-37 
所 示 。 


标签 惊 癌 器 
| 尾 性 | 行为 | 标 竹 <input> 


| = a= | + Nw 
WE 





6-37 “行为 ”面板 


到 这 里 vote.asp 动态 网 页 已 经 设计 完成 。 


下 于 投票 数 累 计 页 面 | 


计算 投票 数 页 面 voteadd.asp， 主 要 方法 是 接收 vote.asp 所 传递 过 来 的 参数 ， 然 后 再 进行 























计算 ， 创 建 方法 如 下 : 
创建 动态 页 面 voteadd.asp， 单 击 局 铝 按钮 ， 然 后 输入 如 下 代码 : 


<!--#include file="Connections/connvote.asp" --> 

<% 

if(request("ID") < の) then Commandl ID= request("ID") 

0%0> 

<% 

set Command1 = Server.CreateObject("ADODB.Command") 

Command1.ActiveConnection = MM connvote STRING 

Command1.CommandText = "UPDATE vote SET vote = vote + 1 WHERE item = "+ 
Replace(Command1 ID,"™™,"™™")+"" 

Command1.CommandType=1 





Command1.CommandTimeout = 0 

Command1.Prepared = true 

Command1.Execute() 

response.redrect( "voteok.asp") 

// 转 到 voteok.asp 页 面 

0%0> 

SQL 语法 说 明 : 

UPDATE vote 

/更 新 vote 数据 表 

SET vote = vote + 1 

/更 新 的 字段 为 “vote” 并 “vote” 在 原 有 基础 上 加 “1? 
WHERE item = ID' 

/更 新 条 件 的 字段 为 “itetm” 等 于 传 过 来 的 参数 “ID?” 


完成 的 voteadd.asp 页 面 的 制作 效果 如 图 6-38 所 示 。 
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6-38 完成 的 voteadd.asp 页 面 效果 


于 下 证 投票 结果 页 面 





最 后 要 制作 显示 投票 结果 页 面 voteok.asp， 这 个 页 面 主 要 用 于 显示 投票 总 数 和 各 投票 的 
比例 ， 静 态 页 面 的 设计 效果 如 图 6-39 所 示 。 
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る る 
<body> divinid> [|9 1100% 、|869 x 452v94K ア 2 秘 簡体 中 文 (GB2312) 














图 6-39 显示 结果 页 面 设计 


其 体制 作 步 又 如 下 : 

创建 voteok.asp 静态 页 面 ， 单 击 “ 绑 定 ” 面 板 中 的 “+” 号 按钮 ， 在 弹出 的 荣 
单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 
“确定 ”按钮 完成 设 定 ， 如 网 6-40 所 示 。 

@ 在 “名 称 ” 文 本 框 中 输入 Rs 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connvote 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 vote。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 设置 “ 沛 选 ” 的 条 件 为 “无 ”。 




















2 
表格 


列 : 包 全 部 し 选 定 的 : 


i 





图 6-40” 设 定 Rs 记录 和 集 


@ 设置 “排序 ”的 条 件 为 “无 ”。 
再 次 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 
(得 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 单 击 “ 高 级 ”按钮 ， 进 入 局 级 编辑 窗口 ， 按 如 下 参 











【在 线 投票 系 








数 进行 设置 : 
@ 在 “名 称 ” 文 本 框 中 输入 Rsl 作为 该 记录 集 的 名 称 。 
@ 从 “连接 ”下 拉 列 表 中 选择 connvote 数据 源 连 接 对 象 。 
@ 在 SQL 文本 框 中 输入 

















SELECT sum(vote) as sum 
/选择 vote 字段 进行 计算 合计 ， 函 数 “sum()” 用 于 计算 总 值 
FROM vote 


// 从 数据 表 “vote” 中 取出 数据 
其 他 参数 保持 默认 值 ， 如 图 6-41 所 示 。 











: jconnvote 


: SELECT sum (vote] as sum 
FROM vote 


参数 : +| 

















数据 库 项 : 表 格 添加 到 | SQL: 
9 還 
半 ”预存 过 程 RR 


URIER BY 








图 6-41 设 定 Rsl 记录 集 





单 击 “确定 ”按钮 ， 完 成 记录 集 的 设置 ， 绑 定 记录 集 后 ， 将 记录 集中 的 字段 插 
入 至 voteok.asp 网 页 的 适当 位 置 ， 如 图 6-42 所 示 。 


違 | n:tchap0Etroteok.asp (KHTML)* 


NEW connvote. asp style2.css 


っ an in) hi STE TES ! 
投票 结果 如 下 
‘Bs. item} : 一 占 {Rs. vote} % 票数 : {Rs. vote} 





< 
<body> <div#mnid> 


图 6-42 ”字段 的 绑 定 


単 市 回 人 按钮 ， 进 入 “代码 ”视图 编辑 页 面 ， 在 “代码 ”视图 编辑 页 面 中 找 
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到 如 下 代码 : 


<%=(Rs.Fields.Item("vote"). Value)%>/<%=(Rsl.Fields.Item("sum"). Value)%> 
/相应 百分比 的 代码 。 


按 下 面 步 又 修改 此 段 代 码 : 
@ 去 挥 “/” 前 面 的 “%>” 和 “/” 后 面 的 <%= 得 到 代码 : 
<%=(Rs.Fields.Item("vote"). Value) / (Rsl.Fields.Item( "sum").Value)%> 


@ 把 “<%=” 和 “9%>” 之 间 的 代码 用 《〈) 把 它 给 括 上 ， 得 到 代码 : 
<%=( (Rs.Fields.Item("vote").Value) / (Rs1.Fields.Item("sum").Value) )%> 

@ 在 代码 后 面 加 入 *100， 再 次 全 部 用 〈) 给 括 上 ， 得 到 代码 : 
<%=( ( (Rs.Fields.Item("vote").Value) / (Rs1.Fields.Item("sum").Value) )*100)%> 


@ 在 代码 前 面 加 入 round， 在 *100 前 面 加 入 小 数 点 保留 位 数 4, 井 用 () 括 上 , 得 到 
代码 : 
<%=(Round(((Rs.Fields.Item("vote").Value)/(Rsl.Fields.Item("sum").Value)),4)*100)%> 
因为 控制 网 页 中 的 长 度 也 用 到 这 段 代 码 ， 所 以 将 这 段 代码 进行 复制 ， 然 后 单 击 
选择 图 案 ， 切 换 到 “代码 ”窗口 ， 选 择 <img> 中 的 width 的 值 将 复制 的 代码 进行 粘贴 ， 因 
为 在 图 案 中 没有 用 到 小 数 点 的 设置 ， 所 以 将 代码 前 面 的 round 和 保留 位 数 4 删除 ， 得 到 的 代 
人 码 如 下 : 
<img src="images/bar.gif" width="<%=(((Rs.Fields.Item("vote"). Value)/ 
(Rsl.Fields.Item("sum"). Value))*100)%>%" height="13" /> 
这 样 图 像 就 可 以 根据 比例 的 大 小 进行 党 度 的 缩放 ， 设 置 如 图 6-43 所 示 。 


= 


了 





TE n: い chap0Etroteok.asp (KHTML)* 


ERLE® connyote.asp style2. css 
网 












div 1d= logo > く 1mg src= /1mageS1/1ridex2 Ul. ]pg 


Bb <div id="bammer"> 
廊 <div class="barmer1"> 
<a href="#"> 首 页 |</a><a href="#"> 且 点 地 图 |<7a><a href="#"》 留 言 咨 询 《 a div> 
i <div class="barmer2"> 
《7 《<a href="#"> 首 页 </ay/ 《a href="#"》 景 点 推荐 </a》/<a href="#"> 团 队 活动 <7a>y<a href="*#"> 再 线 投票 <7a 
闪 >/<a href="#"> 娱 乐 项 目 <7a>y<a href="#" > 交通 路 线 《/a> 《div> 
く /diy> 


< div> 

<div id= “mid “> 

<div id="zhuce" ><img src="/imagesl/index2 03. jpe” /Ydiv> 

<div id="tiao" 

<p> 足 共有 く %= (Rs1.Fields.Item(“sum"). Yalue)%> く /spar> 人 参加 鬼 票 : </p> 
<form id="forml” name="forml” method="post” action=""> 

中 时 《p> 投票 结果 和 如下: </p> 
“5 日 に ーー (Rs. ii Ttem("1tem ) 。 a く 1mg src= 1 ‘bar. gif” width="<%=(( (Rs. Fields. Ttem( 
rote"). Yalue)/ (Rsl.Fields. Itenm(" sum ). Value))*1! ight=" 13"/> 占 《<%= (Round (( (Rs. Fields. Itent 
rote"). Yalue) / (Rs 1.Fields. Itemt” sum っ 'Y alue)), 4) > 

款 数 : <W%= sr Fields. Itemt” vote"). Yalue)%></D> 
<input name=" Submit” type="reset” 本 MU goToURL( parert'。 vote. asp ) ;return 
document. NMOL_returnValue" value=" 返 回 “ = 




















<body> <divimid> <divttiao> <form#forml > <p> 95 下 /2 秒 简体 中 你 (6B2312) 





图 6-43 ”设置 图 标的 缩放 





单 击 通 旨 按钮 ， 回 到 “设计 ”编辑 窗口 ， 由 于 voteok.asp 页 面 显示 投票 选项 
的 所 有 比例 ， 而 目前 的 设 定 只 能 显示 数据 库 的 第 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ” 

















第 6 章 間 CE 








中 的 “重复 区 域 ” 命 令 ， 单 击 voteok.asp 页 面 中 需要 重复 的 行 ， 如 网 6-44 所 示 。 


ED: \chap0E voteok. asp (XHTML)* - 口 X 


[ 泊 慌 志 】 cormvote. asp style2.css 〒 
从 















川 
ody> Cdivinid> <div#tiao? <form#forml >(<p】| | |9 員 100%  v|762x337v 95K ア 2 秘 簡体 中 文 GB2312) 








图 6-44 选择 重复 的 行 
单 击 “ 应 用 程序 ”和 面板 群 组 中 的 “服务 器 行为 ”面板 中 的 “+” 号 按钮 ， 在 弹 
出 的 菜单 列表 中 选择 “重复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 单 击 选 择 “ 所 有 记录 ” 
单 选 按钮 ， 如 图 6-45 所 示 。 




















图 6-45 ”设置 重复 区 域 为 所 有 记录 











单 击 “ 确 定 ” 欣 钮 回 到 编辑 负面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 的 左上 角 出 
现 了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完 成 设 定 。 

选择 页 面 中 的 “返回 ”按钮 ， 选 择 “标签 <inpu 人 ”面板 ， 单 击 “ 行 为 ”面板 
中 的 加 号 “+” 投 钮 ， 在 弹出 的 列表 选项 中 选择 “ 转 到 URL”， 在 打开 的 “ 转 到 URL” 対策 
框 中 的 “URL” 文 本 框 中 输入 要 转 到 的 文件 vote.asp， 设 置 如 网 6-46 所 示 。 


打开 在 : 下 








: vote. asp | [浏览 …. | [浏览 ... | 








图 6-46 转 到 URL 的 设置 








最 后 单 击 “ 确 定 ” 按 钮 ， 完 成 显示 结果 页 面 voteok.asp 的 设置 ， 效 果 如 图 6-47 


所 示 。 


DW 六 作 ) 请 用 人 查看 ii 細 AGO) 角 部 合 ) 精 下 0) 面相 (CO 二 页 的 画 口 (my 理 助 OO | 





Le Yi wa 


ME 本 宣 
1 


| 三 


= Er- 
7 | 


6-47 ”投票 结果 的 效 坟 
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] 7 日 HHHH 


论坛 系统 可 以 说 是 功能 强化 后 的 留言 板 系 


统 ， 每 个 网 站 的 用 户 都 可 以 在 论坛 发 布 信息 或 
提出 看 法 。 本 章 我 们 主要 以 制作 一 个 市 论坛 系 
统 的 文化 艺术 交流 网 站 为 实例 ， 回 该 者 介绍 论 
坛 系统 的 开发 方法 。 


aa 








四 4 机 县 ーー て ル 本 
了 环 博 文化 艺术 2 : 草本 中 本 1 年 重耳 肌 计 二 | Py 出 
着 吉 ! 色 类 天 二 1 误 闭 古市/ 果 册 变性 | 误 化 产业 ! 灾 此 却 品 ) 福全 证 寻 


| Sit 『 > 仿 座 所 


a 


治 坊 立 化 苦 永 
HE. TP 





本 章 的 实例 效果 
J 到 盘 i 


教学 重点 





拾 建 论坛 系统 开发 平台 に 
论坛 系统 规划 の 

论坛 主页 面 に 

新 增 主题 、 删 除 主 题 、 回 复 主 题 的 方法 に 
后 台 管 理 に 
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有 拱 建 论坛 系统 开发 平台 。 


论坛 系统 通过 在 计算 机 上 运行 服务 软件 ， 允 许 用 户 使 用 终端 程序 通过 mtemet 与 其 进行 
连接 ， 执 行 下 载 数据 或 程序 、 上 传 数据 、 阅 读 讨论 主题 、 与 其 他 用 户 交 换 消息 等 功能 。 开 发 
该 系统 同样 需要 在 木 地 计算 机 上 搭建 开发 平台 。 


衝 月 月 使用 Photoshop CS5 分 割 图 片 


下 面 束 开始 用 Photoshop CSS 切片 工具 分 割 首页 图 片 。 

首先 在 本 地 计算 机 的 D 盘 中 建立 站 点 文件 夹 chap07， 在 站 点 文件 夹 里 面 建立 
一 些 常用 文件 夹 。 然 后 从 光盘 中 找到 站 点 chap07/psd 文件 夹 下 的 index.psd 文件 ， 将 其 复制 
到 本 地 站 点 psd 文件 夹 中 。 

启动 Photoshop CS5。 选 择 菜单 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开 首 页 
index.psd 文件 ， 可 分 割 的 效 末 如 图 7-1 所 示 。 
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7-1 设计 的 首页 可 分 割 效果 


开始 分 割 各 部 分 图 片 ， 首 先 分 割 最 上 面 的 Logo 所 在 行 的 图 片 ， 单 击 工具 箱 中 
的 “切片 工具 ”按钮 | 各， 按 住 鼠 标 左 键 从 场景 的 左上 拖 忠 到 标题 的 右 下 角 ， 如 图 7-2 所 
示 ， 图 中 虚线 框 绘 制 的 区 域 就 是 切片 大 小 ， 切 片 后 左上 角 将 显示 一 个 国 国 图 标 。 














环 询 文 化 艺术 


ES ED ER 





7-2 Logo 部 分 的 切片 效果 

















接 下 (Ctrl+H) 组 合 键 ， 打 开 辅 助 线 视 匈 ， 可 以 先 用 辅助 线 分 制 好 需要 分 割 的 
区 域 ， 再 按照 辅助 线 的 分 割 ， 将 整个 网 页 分 割 成 15 个 小 图 片 ， 如 图 7-3 所 示 。 
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还 起 让 全 于 二 


图 7-3 ”分割 整个 首页 的 效果 





选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 256, “ 折 散 ” 模式 , 
“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 7-4 所 示 。 


下 依 为 Web 和 设备 所 用 格式 
厚 粮 “ 义 化 “对联 “而 联 


环 请 文化 艺术  ， 
CKP TI 一 


中 国文 化 产业 品牌 栓 


一 元 入 艺术 的 天 堂 
wey 一 一 一 次 迎 化! 
ーー ター 


= - 并 < 
I 2 2 
Rs Cy Fh 


1 まや 
1 ens ns 


图 7-4 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “ 储 存 ” 按 钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 选择 “保存 在 ” 
后 面 的 下 拉 三 角 按钮 后， 选择 建立 的 chap07 文件 夹 ， 其 他 保持 默认 值 ， 设 置 如 图 7- 所 示 。 
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将 优化 结果 存储 为 





保存 在 这) : 








= 
我 最 近 的 文档 《 回 ) 
a 


上 泉 面 











立件 名 他 ) : 
保存 美 型 I): 
设置 : 

切片 : 


7-5 


GE) 单 击 “ 保 存 ” 按 钮 ， 





index. html 保存 G) 








HTML 和 图 像 人 #*. html) 








默认 设置 











所 有 切片 











“将 优化 结果 存储 为 ”对 话 框 设 置 
完成 保存 切记 的 操作 。 打 开 保存 文件 的 路 径 ， 可 以 看 到 目 





动 生成 了 一 个 名 为 images 的 文件 来 ， 文 件 夹 里 古 前 面 分 割 后 产生 的 小 图 片 ， 由 这 些小 图 片 
组 成 了 首页 的 效 末 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 7-6 所 示 。 
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配置 的 步骤 如 下 : 
首先 启动 IIS, 在 IIS 窗口 中 ， 用 鼠标 右键 单 击 “ 默 认 网 站 ”选择 菜单 中 的 
“属性 ”命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 7-7 所 示 。 


= 賠 博 时 性 ? x © 


网 站 | IS 上 FI 策 选 器 | 主 目录 | 交 档 “| 目录 安全 性 | HTTE 基 | 自 定 必 错误 
网 站 标识 
IF 地 址 立 ): 性 部 未 分 配 ) ~ 
TCF 端 口 Tj: 60 。 | 
连接 
连接 超时 他 ) | 
国保 持 HTTF 连接 后) 






















































































区 ] 局 用 日 志 记 录 ) 
活动 日 志 格 陈 記 ): 


|W3r 扩展 日 志文 件 格式 | 





























图 7-7 “默认 网 站 属性 ”对 话 框 











单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 设置 站 点 文件 夹 路 径 为 
“D:chap07”， 其 他 保持 默认 值 ， 设 置 如 网 7-8 所 示 。 


点 从 网 站 尾 性 


网 站 “| ISAPI 第 选 器 | 主 目录 | 文档 “| 目录 实 全 性 | Tr 共 | 自 定 愉 错 误 
连接 到 资源 时 的 内 容 来 源 : 
⑤ 此 计算 机 上 的 目录 mi) 
〇 另 一 台 计 算 村 上 的 共享 名 ) 
站 重 定向 到 URL 


本 地 蹄 径 [C): In:tchannT | 
品 脚 本 资源 访问 并 1 记录 访问 仿 ) 

读 职 站) 索引 资源 让) 

口 写 入 i) 

[| 目录 浏览 旺 ) 

应 用 程序 语 置 


应 用 程序 名 出 1 默认 应 用 程序 | [删除 区) | 删除 量 ) “| 


开 娟 位 置 : ED 


配置 他 .， | 
抗 行 根 限 中): 釧 脚 計 


应 用 程序 保护 是 ]): 中 (共用 ) wv | 
























































图 7-8 设置 网 站 的 “本 地 路 径 ” 


单 击 “ 确 定 ” 按 钮 ， 完 成 “默认 网 站 属性 ”的 配置 ， 由 于 前 和 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 正 浏览 器 输入 地 
址 http://127.0.0.1， 即 可 打开 页 和 面 分 割 后 的 效果 。 












108 证 创建 编辑 站 点 chap07 
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使用 Dreamweaver CS5 进行 网 页 布局 设计 ， 首 先 需 要 用 定义 站 点 问 导 定义 站 点 ， 操 作 步 


骤 如 下 : 





打开 Dreamweaver CS5， 选 择 菜单 栏 中 的 “站 点 ”一 “管理 站 点 ”命令 ， 打 开 


“管理 站 点 ”对 话 框 。 
ELEZ2) 单 击 右边 的 “新 建 ” 按 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ” 命 
“站 点 设置 对 象 ”对 话 框 ， 进 行 如 下 参数 设置 : 
“站 点 名 称 ” chap07。 
“本 地 站 点 文件 夹 ” Di:chap07\。 
如 图 7-9 所 示 。 


站 点 设置 对 甸 chap07 








Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Dreamweaver 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文 件 的 计算 机 上 的 本 地 文件 
夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 到 web 上 的 服务 器 上 的 远程 文件 夹 。 








您 可 以 在 此 处 汰 Dreamweayer 站 点 选择 本 地 立 件 来 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 来 ; = 





图 7-9 设置 站 点 对 话 框 


早 击 “分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 
“服务 器 名 称 ”: chap07。 

“连接 方法 ”， 本 地 /网 络 。 

“服务 器 文件 夹 ”，D:chap07。 

“Web URL”: http:/127.0.0.1。 


单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 在 Dreamweaver CS 中 就 已 经 拥有 


了 刚才 押 设 置 的 站 点 。 








对 整体 的 页 面 布局 规划 设计 ， 如 图 7-10 所 示 。 
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图 7-10 整体 布局 设计 


使用 div+CSS 布局 首页 的 步骤 如 下 : 
将 原来 的 index.html 中 的 所 有 代码 删除 ， 然 后 修改 为 标准 的 ASP 文档 格式 ， 
将 </head> 以 上 的 代码 优化 为 如 下 代码 : 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>// 宣 告 为 ASP 文档 

<IDOCTYPE html PUBLIC "“-/W3C/DID XHTML 1.0 Transitional/EN" "http://www.w3. 
org/ TR/xhtmll/DTD/xhtmll -transitional.dtd"> 

<html xmlns="http:/www.w3.org/1999/xhtml"> 

く head> 

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 

<link rel="stylesheet" href="css/style.css" type="text/css"/> 

<title> 文 化 艺林 </title> 

</head> 
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其 他 div 的 布局 代码 如 下 : 


<body> 
<div id="top "> 
<div id="logo"><img src デ "1mages/index 01.jpg" /></div> 
<div 1d="banner"> 
<div class="banner1 "> 
<a hre 伍 #"> 首 ”页 </a> | <a hre 伍 "#"> 注 ” 册 </a> | <a hre 伍 "#"> 登 、 录 </a> | <a hre 伍 "#"> 收 藏 
本 站 </a> | <a hre 伍 "#"> 网 站 地 图 </a></div> 
<div class="banner2"> 
<a href="#"> 首 页 </a>|<a hre 伍 "#"> 和 党 甘 天 地 </a>|<a href="# が > 文化 超 市 </a>|<a hre 伍 "#"> 时 
尚文 化 </a>|<a hre 住 "#"> 文 化 产业 </a>|<a hre 伍 "#"> 文 化 博览 </a>|<a hre 伍 "#"> 文 化 论坛 </a></div> 
</div> 
</div> 
<div 1d="mid"> 
<div id="tiao"><img src="/1mages/index 03.jpg"></div> 
<div id="tul "><img src デ "71mages/index 04.jpg"></div> 
<div id="pinpai"><img src="/1mages/index 05.jpg"></div> 
<div id="neil "> 
<div class="nei1 "> <a hre 人 f="#"> 刚 刚 进入 21 世纪 ， 文 化 产业 便 在 世界 范围 内 呈现 出 
焊 发 式 的 发 展 态势 ， 并 已 经 成 为 世界 发 达 国 家 和 地 区 新 型 经 济 的 增长 极 。 文 化 与 技术 紧密 结合 ， 打 造 
出 文化 产业 这 一 “朝阳 产业 ”的 诱 人 前 景 。 </a></div> 
</div> 


<div id="wel"><img src="/1mages/index 07.jpg"></div> 











<div id="zixun "><img src="/images/index 08.jpg"></div> 
<div id="nei2"> 
<div class="nei2"> 
<a hre 伍 "#">“ 相 约 北京 ”文化 活动 于 不胜 收 
2008-06-11</a> <a hre 伍 "#"> 文 艺 作 品 彩 显 中 华 民 族 伟 大 精神 
2008-07-11</a> <a hre 伍 "#">《 热 血 五 月 2008》 学 术 座谈 会 
2008-07-05</a></div> 
</div> 
<div 1id="tu2"><img src="/images/index 10.jpg"></div> 


<div id="minfeng"> 








<div class="minfeng"> <a hre 人 ="#"> 婚 并 习俗 是 社会 风俗 的 重要 组 成 部 分 ， 也 是 村 
沙文 化 的 重要 内 容 ， 它 最 能 形象 地 反映 区 域 社会 与 族群 文化 的 特质 .. 

</a></div> 

</div> 


<div id="nei3 "><img src="/images/index 12.jpg"></div> 
<div id="tui"><img src="/1mages/index 13.jpg"></div> 
<div 1d= "us"><lmg src="/i1mages/index 14.jpg"><7d1v> 

</div> 

<div id="bottom"> 

<div id="copyright"><img src="/1mages/index 15.gif"></div> 

</div> 

</body> 

</html> 
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div 布局 完成 后 需要 将 该 负面 你 存 ， 选 择 亲 单 栏 中 的 “文件 ”一 “为 存 为 ” 命 
令 ， 打 开 “ 万 存 为 ”对 话 框 ， 在 “文件 名 ”文本 框 中 输入 文件 名 为 “index.asp”“， 单 击 选 择 
“保存 类 型 ”后 面 的 下 拉 三 角 按 钮 关 ， 在 打开 的 快捷 菜单 中 选择 Active Server Pages (*.asp: _ 
*.asa) 菜单 项 ， 如 图 7-11 所 示 。 单 击 “ 保 存 ” 按 钮 完成 首页 的 布局 设计 。 ©) 








保存 在 红 ): し コ chap0T 


psd 
© 


桌面 


5 


岡上 部 居 


文件 名 男 ) : index. asp 保存 (8) 


保存 美 型 代 〕: hctive Server Pages (*. asp;*. asa) | 取消 








图 7-11 “另存 为 ”对 话 框 设 置 
在 站 点 中 建立 css 文件 来， 并 建立 一 个 style.css 样式 文件 ， 对 首页 的 样式 控制 
代码 如 下 : 


な 页 面 整体 CSS*/ 
*{ margin:Opx; 





padding:Opx:! 
body{ width:100%; height: 100%; font-size:12px: background:#FC6:) 
上 # 设 置 页 面 链 接 光 
a:link { 
color: #000000: 
text-decoration: none: 
) 
a:visited 1 
text-decoration: none; 
color:#673914: 
} 
a:hover { 
text-decoration: underline; 
color: #F F9900; 
} 
a:active { 
text-decoration: none: 
color: #000000; 
} 
な 设置 所 有 图 片 的 边框 为 0*/ 
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Img { 

border: 0:) 
な 设置 最 外 层 大 中 显示 ， 实 现 让 整个 页 面 大 中 显示 */ 
#top,#mid,#bottom{ margin:auto; width:99Spx;} 
/* 设置 左 浮动 的 标签 */ 
#logo,#banner,#tul,#pinpai,#neil, 

















#wel,#zixun,#ne12,#tu2,#minfeng, 
#ne13,#tui,#us{ float:left;} 
/*top 部 分 */ 

#banner{ width:644px: 

height:126px: 
background-image:url(/7nmages/index 02.jpg):) 

.bannerl 1 width:270px: 

height: 1 Spx; 
margin-left:3 10px; 
margin-top:SSpx;} 

.banner21 width:580px; 

height:23px: 
margin-left:49px: 
margin-tOD:27DX: 
font-size: 18px; 
font-weight:bold; 

.banner2 a:link { 
color: #000000: 
text-decoration: none: 

} 

.banner2 a:visited { 
text-decoration: none: 
color:#FFF:; 

} 

.banner2 a:hover { 
text-decoration: underhne: 
color: #FF9900: 

} 

.banner2 a:active { 
text-decoration: none: 
color: #000000; 

} 

/*mid 部 分 */ 

#mid{ background-color:#FFF:) 

#nell { width:417px; 

height:75px; 
background-image:url(/1mages/index 06.jpg):) 

.nell 1 width:340px: 

height:60px: 
margin-left:SOpx; 
margin-top: 7px; 











line-height: 1 Spx;} 
#ne121 width:417px; 
height:90px: 
backeround-image:url(/1images/mndex 09.jpg):) 
.ne121 width:345px: 
height:60px: 
margin-left:42px; 
margin-top:3px; 
line-height:20px;} 
#minfeng{ width:171px: 
height:159px: 
background-image:url(/images/index 11.jpg):! 
.minfeng{ width:133px: 
height:80px: 
margin-left:33px; 
margin-top:39px; 
line-height: 1 Spx;} 
.Show{ width:880px; 
margin-left:SOpx; 
margin-top:30px; 
margin-bottom:30px; 
line-height: 1 Spx;} 





将 首页 中 间 部 分 删除 ， 存 为 moban.asp 作为 二 级 页 面 ， 如 图 7-12 所 示 。 
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7-12 ”制作 的 三 级 页 面 效 末 








_ Section_ 


叶 下 ”论坛 系统 规划 


本 市 将 介绍 论坛 系统 的 整体 规划 与 数据 库 设 计 。 论 坛 系统 的 页 面 要 实现 的 功能 主要 包括 
狐 增 讨论 主题 、 回 复 讨论 主题 、 修 改 讨 论 主题 、 删 除 讨论 主题 、 删 除 回复 内 容 以 及 关键 词 搜 














论坛 系统 的 页 面 比 较 多 ， 在 制作 之 前 要 先 对 各 个 页 和 面 做 一 下 了 解 。 本 实例 开发 该 论 


本 骤 如 下 : 
在 正 浏 览 器 中 输入 本 系统 的 访问 地 址 ， 打开 本 系统 的 首页 如 图 7- 13 所 示 。 
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图 7-13 系统 的 首页 效果 


单 击 “ 文 化 论坛 ”文字 链接 可 以 打开 论坛 系统 的 主页 forum.asp， 如 图 7-14 所 
示 。 在 该 页 面 上 主要 显示 讨论 标题 、 发 言 者 的 表情 、 作 者 、 回 复 次 数 、 最 新 回复 的 时 间 、 阅 


读 的 次 数 以 及 标题 的 发 布 时 间 。 
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7-14 论坛 首页 效果 











【论坛 系统 





单 击 讨论 标题 即 可 以 进入 相应 的 讨论 页 面 detaiLasp， 如 图 7-15 所 示 。 
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可 古 Entarmm 
图 7-15 论坛 的 讨论 页 面 
单 击 detail.asp 负面 中 的 “回复 主题 ”文学 链接 ， 即 可 以 进入 回复 主题 页 面 
reforum.asp， 如 图 7-16 所 示 。 输 入 相应 的 信息 后 ， 单 击 “ 确 定 提 交 ” 按 钮 即 可 完成 主题 回 
复 的 功能 。 
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图 7-16 回复 主题 的 页 面 





单 击 论坛 系统 的 主页 forum.asp 中 的 “管理 ”文字 链接 即 可 以 进入 后 台 管 理 者 
登录 页 面 admin login.asp， 如 图 7-17 所 示 。 
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汉文 化 艺术 - Nicrosoft Internet Explorer 
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; 地 址 ①) | http 12T. ロロ 17Eorum ア admin login. asp 





后 台 管理 
官 理 用 户 :admin 
管理 密码 ， admin| 




















入 Internet 








图 7-17 后 台 管 理 登 录 页 面 


输入 用 户 名 和 密码 ， 单 击 “ 登 录 ” 按 钮 ， 即 可 以 登录 后 台 管理 的 主页 面 
admin.asp， 如 图 7-18 所 示 。 在 该 页 面 中 增加 了 “修改 ”和 “删除 ”的 功能 ， 管 理 者 可 以 单 
击 相 应 的 链接 进入 相关 的 主题 进行 管理 
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图 7-18 后 台 管 理 主 页 面 


单 击 其 中 任意 一 个 标题 后 面 的 “修改 ”链接 ， 可 以 进入 讨论 标题 和 内 容 的 修改 
页 面 adtitle.asp， 如 图 7-19 所 示 。 修 改 相 关 的 内 容 后 单 击 “确定 修改 ”按钮 即 完成 修改 。 
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图 7-19 讨论 标题 修改 页 面 


单 击 管理 主页 面 admin.asp 中 的 任意 一 个 讨论 主题 后 面 的 “删除 ”文字 链接 ， 进 入 
删除 讨论 标题 页 面 deltitle.asp， 如 图 7-20 所 示 。 单 击 “ 确 定 删除 ” 即 完成 该 主题 的 删除 操作 。 
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图 7-20 删除 讨论 主题 页 面 
sua) + 





沦 坛 系统 还 要 有 删除 回复 的 功能 ， 在 这 里 单 击 管理 的 主页 面 admin.asp 中 的 任 
本 NGI A 面 delrefasp, a 7-21 所 示 。 
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删除 回复 的 主页 面 
早 击 加 除 回复 页 面 delref.asp 中 的 “删除 回复 ”文字 链接 


确定 页 面 delrefcontent.asp， 如 图 7-22 所 示 。 单 击 “ 确 定 删 除 ” 按 钮 后 ， 
从 数据 库 中 删除 。 





即 可 进入 删除 回复 
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图 7-22 确定 删除 回复 的 页 面 
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建立 论坛 数据 库 


论坛 的 数据 库 开 发 主要 由 开发 系统 的 大 小 而 定 ， 本 实例 建立 一 个 forum 数据 库 ， 并 在 里 
面 建立 admins、bbsmain、bbsref 三 个 数据 表 ， 其 中 bbsmain 数据 表 用 于 存放 论坛 讨论 主题 的 
一 些 信息 数据 ，bbsref 数据 表 用 来 存放 回复 主题 的 一 些 信息 数据 ， 本 实例 的 难点 在 于 这 两 个 
数据 表 的 关联 使 用 。 

首先 使 用 Microsoft Access 2007 创建 forum 数据 库 ， 具 体制 作 步 又 如 下 : 

首先 运行 Microsoft Access 2007 程序 。 单 击 “ 空 白 数据 库 ” 按 钮 .号 .， 在 主 界 
面 的 側 打 井 “空白 数 据 麻 ” 面板 。 























开 “ 文 件 新 建 数据 库 ” 对 话 框 ， 在 “保存 位 置 ” 后 面 的 下 拉 列 表 中 选择 前 面 创建 站 点 chap07 
中 的 mdb 文件 夹 ， 在 “文件 名 ”文本 框 中 输入 文件 名 forum。 单 击 “ 确 定 ” 投 钮 ， 返 回 “ 至 
日 数据 库 ” 和 面板。 

単 証 “空白 数 据 麻 ” 面板 中 的 “ 倒 建 抜 視 ”, 即 在 Microsoft Access 2007 中 创 
建 了 forum.mdb 文件 , 同時 MicrosoftAccess 2007 目 动 生成 了 一 个 名 为 “ 表 1: 表 ” 数 据 表 。 

建立 数 据 麻 forum 之 后 ，forum 数据 库 中 的 数据 表 需 要 创建 后 台 管 理 表 
admin、 讨 论 主题 数据 表 bbsmain 以 及 回复 主题 数据 表 bbsref。 设 计数 据 库 中 后 全 管理 数据 表 
admin 的 字段 结构 采用 表 7-1 所 示 的 结构 。 


表 7-1 管理 者 信息 表 admin 


意 义 字段 名 称 数据 类 型 字段 大 小 | 必 填 字段 | 允许 空 字符 串 驮 认 值 


按 表 7-1 创建 的 admin 数据 表 如 图 7-23 所 示 。 
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图 7-23 创建 admin 表 的 字段 
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设计 数据 库 中 发 表 主题 的 数据 表 bbsman 的 字段 结构 采用 表 7-2 所 示 的 结构 。 
这 个 数据 表 用 于 储存 讨论 主题 的 相关 内 容 ， 其 中 bbsID 字段 作为 主 索引 栏 。 





表 7-2 主题 数据 表 bbsmain 


意 义 | 字段 名 称 允许 空 字符 串 | 默 认 值 
发 布 痢 邮 条 


按 表 7-2 创建 的 bbsmain 数据 表 如 图 7-24 所 示 。 
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图 7-24 bbsmain 数据 表 














设计 数据 库 中 回复 主题 数据 表 bbsref 的 字段 结构 采用 表 7-3 所 示 的 结构 。 这 个 
数据 表 用 于 储存 回复 讨论 的 相关 内 容 ， 其 中 以 bbsrefID 子 段 作为 主 索 引 栏 。 












表 7-3 主题 数据 表 bbsref 


HR | wm | Hm | | | 
gm | wa | | | | 
Of | wwemm | 人 | | * | ぁ wu 
WW | waeewn | xt | mg | ぁ a | su 


按 表 7-3 创建 的 bbsref 数据 表 如 图 7-23 所 示 。 
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图 7-25 bbsref 数据 表 


创建 数据 库 连 接 








数据 库 编辑 完成 后 ， 必 须 在 Dreamweaver CSS 中 建立 能 够 使 用 的 数据 源 连 接 对 象 。 这 样 
才能 在 动态 网 页 中 使 用 这 个 数据 库 文 件 。 操 作 的 过 程 中 应 特别 注意 ODBC 连接 时 参数 的 设 





置 。 有 具体 连接 步骤 如 下 : 








在 “控制 面板 ”中 ， 选 择 “ 管 理工 具 ” 打 开 管 理工 具 窗口 ， 双 击 运行 “ 数 
据 源 (ODBC)” 的 快捷 方式 咒 ” ， 将 打开 如 图 7-26 所 示 的 “ODBC 数据 源 管理 器 ”对 


话 框 。 
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对 认 值 


=Now() 











第 7 音 | 论坛 系统 





单 击 “ODBC 数据 源 管理 器 ”对 话 框 中 的 “系统 DSN” 选 项 卡 ， 如 图 7-27 
所 示 。 


を ToDBc 数据 源 管 理 器 を 10DBC 数据 源 管 理 器 
用 户 DSH | 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 用 户 DSW 系统 DSH | 文件 DSW| 3E 动 程序 | 跟踪 | 连接 池 | 关于 | 


用 户 数 据 源 UW): 系统 数据 源 (8): 
添加 Q⑪).… | 驱动 程序 添加 ⑪).… | 


Microsoft AAccess dEASE Driver 必 . river do Microsoft Access (*.mdb) 


Excel Files Microsoft Excel Driver [(*.xls, *.x ] | dsrrews Driver do Microsoft Access (*.mdb】) ) | 
MS Accass atabase Microsoft Access Driver (*.mdb, * 間際 間際 


配置 (C).… 配置 (C)... | 


ODEC 系统 数据 源 存 诗 了 如 何 与 指定 数据 提供 程序 连接 的 信息 。 系 
銃 数 手 着 対 当 前 机 器 上 的 所 有用 呆 可 見, 包括 WT 服务 。 





图 7-26 ODBC 数据 源 管理 器 中 的 用 户 DSN 图 7-27 ODBC 数据 源 管 理 需 中 的 系统 DSN 


在 “系统 DSN” 对 话 框 中 单 击 “ 添 加 (D)” 投 钮 ， 打 开 “ 创 建新 数据 源 ” 对 
话 框 ， 如 图 7-28 所 示 。 

在 “创建 数据 源 ” 对 话 框 中， 选择 “Driver do Microsoft Access (*.mdb)” 选 
项 ， 然 后 单 击 “ 完 成 ”按钮 。 打 开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 源 名 
CN)” 文 本 框 中 输入 forum， 如 图 7-29 所 示 。 
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图 7-28 倒 建 数 据 源 图 7-29 ODBC Microsoft Access 安装 


单 击 “选择 (S)” 按 钮 ， 打 开 “ 选 择 数 据 库 ” 对 话 框 ， 如 图 7-30 所 示 。 単 市 
“驱动 器 (V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 了， 从 下 拉 菜 单 中 找到 在 创建 数据 库 步 骤 中 数据 库 
所 在 的 盘 符 ， 在 “目录 (D) :” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 
左上 方 “数据 库 名 〈A)” 选 项 组 中 的 数据 库 文 件 forum.mdb， 则 数据 库 名 称 目 动 添加 到 “ 数 
据 库 名 “A)” 下 方 的 文本 框 中 。 

找到 数据 库 后 ， 在 “选择 数据 库 ” 对 话 框 中 单 击 “确定 ”按钮 ， 回 到 
“ODBC Microsoft Access 安装 ”对 话 框 中 ， 再 次 单 击 “确定 ”按钮 ， 将 返回 到 “ODBC 数 
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据 源 管理 右 ” 中 的 “系统 DSN” 对 话 框 中 ， 则 可 以 看 到 “系统 数据 源 〈S)” 中 已 经 添加 了 
一 个 名 称 为 “forum”， 驶 动 程序 为 “Driver do Microsoft Access (*.mdb)” 的 系统 数据 源 ， 
如 图 7-31 所 示 。 


を 10DBC 数据 源 管理 器 
用 户 nsN 系统 DSH | 文件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 ): 


添加 年).. . 
人 Driver do Microsoft Access (*.mdb) 
Driver do Microsoft Access (*.mdb) ] | 
Driver do Microsoft Access (x.mdb) 間際 


ーー Driver do Microsoft Access (*.mdb) 
目录 Da: ote Driver do Microsoft Access (*.mdb) 配置 (C). | 


d: chanHT mdb 


[Sd 
[SS charHT 


0DBC 系统 数据 源 存 诸 了 如 
统 数 据 源 对 当 前 条 器 上 的 所 


世人 忻 当 型 (I) : 


|Access 数据 库 fm 下 | | 国 4: 新吉 巻 "| 





图 7-30 ”选择 forum.mdb 数据 库 图 7-31 ODBC 数据 源 管理 器 





再 次 单 击 “ 确 定 ” 按 钮 ， 完 成 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 


司 动 Dreamweaver CS5， 设置 好 “站 点 ”“ 文 档 类 型 ”和 “测试 服务 器 ”， 在 
Dreamweaver CS5 软件 中 打开 剖面 布局 的 index.asp 页 面 ， 执 行 菜单 栏 中 的 “文件 ”一 “ 窗 
口 ” 一 “数据 库 ” 命 令 ， 打 开 “ 数 据 库 ”面板 。 

单 击 “数据 库 ” 面 板 中 的 “+” 号 按钮 ， 单 击 选择 “数据 源 名 称 (DSN)” 

打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 : ”文本 框 中 输入 dsnforum, 

単 訓 “数 据 源 名 称 (DSN): ”文本 框 右 侧 的 三 角 按 钮 兰 ， 从 打开 的 下 拉 菜 单 中 选择 在 “数据 源 
(ODBC)” 一 “系统 DSN” 中 所 添加 的 forum， 其 他 保持 默认 值 ， 如 图 7-32 所 示 。 

在 “数据 源 名 称 (DSN)” 页 面 中 ， 单 击 “ 测 试 ”按钮 ， 如 果 打开 图 7-33 所 示 页 
面 ， 则 说 明 数 据 库 连接 成 功 ， 否 则 应 逐一 检验 之 前 各 项 步骤 是 否 正 确 完成 ， 修 改 至 测试 成 功 。 


数据 源 名 称 (DSH) 
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合 令 

















连接 名 称 : dsnforunm| 


数据 源 名 称 (DSW): | forun Wm | Dreamweaver Fd 
用 名 : ーー 


密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSW 
>) 使 用 本 地 DSH 





图 7-32 ”数据 源 名 称 (DSN) 图 7-33 ”成功 创建 连接 脚本 
单 击 “ 确 定 ” 按 钮 ， 完 成 数据 库 的 连接 。 














| Section_ 


和 到 论坛 主页 面 及 其 查询 功能 


在 Dreamweaver CSS 中 定义 站 点 ， 在 数据 库 之 间 建 立 连 接 后 ， 就 可 以 进入 ASP 动态 网 
页 页 面 的 设计 阶段 。 


8 论坛 主页 面 
制作 讨论 主题 系统 的 主页 面 forum.asp， 这 个 页 ee ne 题 的 标题 ， 使 


用 者 可 以 选择 要 阅读 的 标题 链接 至 详细 内 容 页 面 ， 以 及 管理 者 进入 管理 页 面 的 链接 。 系 统 主 
页 面 的 静态 部 分 美工 设计 如 图 7-34 所 示 。 
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图 7-34 系统 主页 面 


这 个 网 页 的 主要 目的 是 要 显示 所 有 的 讨论 主题 、 每 个 主题 的 浏览 次 数 、 回 复数 与 最 新 回 
复 时 间 及 发 布 时 间 ， 详 细 制 作 步骤 如 下 ; 
在 “ 绑 定 ”面板 中 单 击 加 号 “十 ” 按钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 
(查询 )” 选 项 。 
打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 如 图 7-35 所 示 。 
在 “名 称 ” 文 本 框 中 输入 rsBB 作为 该 记录 集 的 名 称 。 
从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 
从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 
在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 
设置 “筛选 ”的 条 件 为 “无 ” 
设置 “排序 ”的 条 件 为 “无 ”。 
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图 7-35 設定 rsBB 记录 集 
单 击 “ 高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 的 页 面 ， 将 现 有 的 SQL 语句 改 成 以 下 
的 SQL 语句 ， 如 图 7-36 所 示 。 

01. SELECT 

02. bbsmam.bbsID, 

03. FIRST (bbsmain.bbstime) AS bbstime, FIRST (bbsmain.bbshits) AS bbshits, 

04 . FIRST (bbsmain.bbstitle) AS bbstitle,FIRST (bbsmam.bbsurl) AS bbsurl, FIRST 
(bbsmain.bbsemail) AS bbsemailFIRST (bbsmam.bbssex) AS bbssex, FIRST (bbsmam.bbsface) AS 
bbsface, FIRST (bbsmain.bbscontent) AS bbscontent, 

05. FIRST (bbsman.bbsname) AS bbsname,COUNT(bbsret.bbsmainlD) AS ReturnNum, 

06. MAX(bbsreft.bbstime) AS LatesTime 

07. FROM 

08. bbsmain LEFT OUTER JOIN bbsref ON 

09. bbsmain.bbsID=bbsref.bbsmainlD 

10. GROUP BY bbsmam.bbsID 


名 称 : 
连接: dsnforum wv 


SQL: SELECT bbsmain. bbsTI, 
smain. bbshits) AS 





FIRST (bb 
bbstitle, 
(bbsmain. bbsemail) MS TRST AS bbssex, 

FIRST (bbsmain. bbsface , TFTRST (bbsmain. bbscontent) AS 本 





参数 : +| 
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图 7-36 改写 SQL 语句 
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说 明 : 

第 一 条 bbsref 数据 表 中 的 记录 都 可 以 通过 bbsmainID 字段 关联 到 bbsmain 数据 表 中 的 
bbsID 字段 。 就 是 说 bbsref 数据 表 中 对 应 的 数据 表 可 能 不 存在 ，bbsmain 数据 表 并 非 一 定 有 
对 应 回复 的 话题 。 因 此 以 LEFT JOIN 将 接合 关系 中 的 两 个 数据 表 分 成 左右 两 个 数据 表 ， 其 
中 左边 数据 表 在 经 过 接合 后 ， 不 管 右边 数据 表 是 否 存 在 数据 与 之 对 应 ,仍然 会 将 数据 全 部 列 
出 。 简 单 的 说 ， 就 是 不 管 讨论 主题 bbsmain 是 否 有 任何 的 回复 bbsref， 使 用 LEFT JOIN 可 以 
将 数据 表 bbsmain 中 的 所 有 讨论 主题 都 显示 出 来 。 

另外 GROUP BY 语句 是 针对 bbsMain 数据 表 中 的 bbsID 字段 ， 在 第 2 行 到 第 6 行 之 间 
的 意思 就 是 说 取出 bbsmian 数据 表 中 的 第 一 条 数据 的 特定 字段 内 容 。 同 时 将 bbsref 中 的 关联 
取出 ， 获 得 bbstime 和 bbsID 的 两 个 字段 内 容 。bbstime 字段 则 取 所 有 记录 当中 时 间 最 新 的 那 
一 条 。 而 bbsid 字段 则 用 COUNT 计算 有 多 少 人 回复 的 总 数 。 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 全 forum.asp 网 页 的 适当 位 置 ， 如 图 7-37 
所 示 。 
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图 7-37 字段 的 插入 


加 入 “如 果 记 录 集 不 为 空 则 显示 区 域 ”功能 。 首 先 选 中 记录 集 有 数据 时 要 显示 
的 数据 表格 ， 如 图 7-38 所 示 。 
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图 7-38 ”选择 要 显示 的 表格 


单 击 “应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 ， 并 在 面板 中 单 击 加 号 “+” 
按钮 ， 在 弹出 的 菜单 列表 中 ， 选 择 “ 显 示 区 域 ”~ “如 果 记 录 集 不 为 空 则 显示 区 域 ” 选 
项 。 























打开 “如 果 记 录 集 不 为 空 则 显示 区 域 ”对 话 框 ， 保 持 默认 值 ， 单 击 “ 确 定 ” 按 
钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 显示 的 区 域 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显 
























示 ...” 的 灰色 卷 标 ， 这 表示 已 经 完成 设置 ， 如 图 7-39 所 示 。 
如 果 记 对 集 科 为 空 则 显示 区 城 
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图 7-39 ”完成 设置 后 的 效 采 
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将 “目前 没有 发 表 任何 主题 ”区 域 设 定 成 “如 果 数 据 集 为 空 则 显示 区 域 ” 如 


图 7-40 所 示 。 
如 果 记 录 集 为 空 则 显示 区 城 
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图 7-40 ”如 果 数 据 集 为 空 则 显示 区 域 设 置 











【论坛 系统 











由 于 要 在 forum.asp 这 个 页 面 显示 数据 库 中 的 所 有 记录 ， 而 目前 的 设 定 只 能 显 
示 数 据 库 的 第 一 条 数据 ， 因 此 需要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 功 能 。 单 击 
rmasp 页 面 中 要 重复 的 单元 格 ， 如 图 741 所 示 、 

















i rsBE. bbstitle} raps. bbsname} tr Rm) {rsBB. LatesTime} ifrsBB. bbshits} :{rsBB. bbstime} : © 
記事 信人 さ 諸 本 価 則 見 : : 





7-41 选择 要 重复 的 单元 格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“十 ” 投 钮 。 在 弹出 的 某 单 中 ， 选 择 “重复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 单 击 “ 确 
定 ” 按 钮 回 到 编辑 页 面 ， 发 现 先 前 所 选取 要 重复 的 区 域 左 上 角 出 现 了 一 个 “重复 ”的 灰色 标 
签 ， 这 表示 已 经 完成 议定 了 了， 如 图 7-42 所 示 。 
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7-42 设置 “重复 区 域 ” 








把 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 揪 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 条 ”按钮 受 |. 

打开 “记录 集 导 航 条 ”对 话 框 ， 单 击 选择 “记录 集 ” 后 面 的 下 拉 三 角 按钮 ， 在 
展开 的 菜单 中 选择 rsBB 记录 集 ， 然 后 再 单 击 选择 “显示 方式 ”为 “文本 ” 单 选 按钮 ， 最 后 单 
击 “确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 页 面 中 自动 插入 记录 集 的 导航 条 ， 如 图 7-43 所 示 。 
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图 7-43 ”添加 记录 和 集 导 航 条 








在 forum.asp 这 个 页 面 中 除了 显示 网 站 中 所 有 的 讨论 主题 外 ， 还 要 为 浏览 者 提 

供 单 击 标题 内 容 链接 至 详细 内 容 页 面 来 阅读 ， 因 此 需要 加 入 “ 转 到 详细 页 面 ”服务 器 行为 。 

首先 选中 {rsBB.bbsTitle} 字段 ， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 

“添加 服务 器 行为 ”加 号 “十 ”按钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ”的 选项 。 
打开 “ 转 到 详细 页 面 ”对 话 框 ， 按 图 7-44 所 示 进 行 设 置 。 














转 到 评 细 页 面 





链接 : | 所 选 范围 : “<%= (rsBB.Fis1ds.Tt, v | 
详细 信息 页 : /forum/ detail. asp | 
传递 URL 参数 : bbsID ， 设置 为 以 下 项 的 值 


ww 









































图 7-44 设置 “ 转 到 详细 页 面 ” 对 话 框 


在 forum.asp 页 面 中 有 两 个 文字 连接 “发 表 话 题 ” 和 “管理 ” 必须 设 定 其 
“链接 ”网 页 ， 其 中 “发 表 话 题 ”链接 到 forum add.asp,“ 管 理 ” 链 接 至 admin login.asp， 设 
置 如 图 7-45 所 示 。 
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7-45 设置 链接 





















































设置 链接 之 后 ， 把 鼠标 插入 到 “表情 ”下 面 的 单元 格 里 执行 沫 单 栏 中 的 “ 插 
入 ”一 “图 像 对 象 ” 一 “图 像 占 位 符 ” 人 命令， 打开“ 网 像 占 位 符 ” 对 话 框 ， 设 置 高 度 和 宽度 
都 入 20 像素 ， 如 图 7-46 所 示 。 单 击 “ 确 定 ” 按 钮 插入 一 个 图 像 占 位 和 从。 


图 萤 占 世 行 





放 人 


颜色 [FL | 
に に と 38 | | 





7-46 搬入 “図像 占 位 符 ? 


插入 “图 像 占 位 符 ” 之 后 ， 选 中 峡 像 占 位 符 ， 单 击 “ 属 性 ”面板 中 的 “ 源 文 
件 ” 文 本 框 后 面 的 “浏览 文件 ”按钮 加 ， 打 开 “ 选 择 图 像 源 文 件 ” 对 话 框 ， 在 该 对 话 框 中 单 
击 选 择 “ 数 据 源 ” 单 选 按钮 ， 然 后 在 “ 域 ” 列 表 框 中 单 击 选择 “记录 集 (rsBB)” 中 的 
bbsface 字段 ， 如 图 7-47 所 示 。 





-器 "| 目 录 
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选择 文件 名 自 : 〇 ) 立 件 系统 
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bbsname 

ReturnNum 
LatesTime 

[第 一 个 记录 索引 ] 
[最 后 一 个 记录 索引 ] 
[总 记录 数 ] 





格式 : 无 


URL: | 人 = (rsBB. Fields. Item("bbsface”). Value)%> 











在 站 点 定 尺 中 更 改 默 认 的 链接 相对 于 





7-47 选择 bbsface 字段 


单 击 “ 确 定 ” 投 钮 ， 完 成 “图 像 占 位 符 ” 的 数据 源 绑 定 操作 ， 此 时 页 面 效 果 如 
图 7-48 所 示 。 
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7-48 绑 定 “图 像 占 位 符 ” 的 数据 源 的 效果 


在 forum.asp 负面 中 加 入 查询 功能 也 是 必要 的 ， 在 论坛 使 用 较 长 一 段 时 间 后 ， 会 建立 很 
多 主题 ， 网 站 浏览 者 可 以 使 用 但 询 功 能 找到 
相应 的 讨论 主题 ， 然 后 方便 地 进行 回复 , 查 zm:| |[ 本 | 
询 主题 的 静态 设计 如 图 7-49 所 示 。 











得 询 切 能 的 人 制作 步 又 如 下 ; 7-49 ”查询 主题 设计 
单 击 选择 “但 询 主题 ”后 面 的 
文本 框 ， 在 “属性 ”面板 中 设置 “文本 域 ”名 为 keyword， 设 置 “ 衬 符 宽 度 ” 为 30， 蠕 击 选 


择 “ 关 型 ”为 “单行 ”的 单 选 按钮 ， 其 他 保持 默认 值 ， 如 图 7-50 所 示 。 
= 
口 文大 字 符 宮 度 ⑪ 50 | 类 型 @ 单 行 @6) 〇 多 行 。” 〇 密码 所 ) 
最 多 字符 数 | | 初始 值 CI | 19 
口 禁 用 ⑪) 
只 读 色 ) 
7-50 设置 “文本 框 ” 属 性 
将 之 前 建立 的 记录 集 rsBB 做 一 些 更 改 ， 双 击 rsBB 记录 集 打 开 “ 记 录 集 ”对 话 
框 ， 在 原 有 的 SQL 语法 中 ， 加 入 一 段 碍 询 功 能 的 语法 : 
WHERE bbsTitle hke “%"&keyword&"%' 


说 明 : 
其 中 like 是 模糊 查询 的 运算 子 ; % 表 示 任 意 字 符 : keyword 是 一 个 变量 ， 代 表 在 网 页 中 
输入 的 关键 词 。 


那么 以 前 的 SQL 语句 将 变 成 如 图 7-51 所 示 。 




















论坛 系统 





: rsBE 











: | dsntorunm | 定 尺 ... 








: bbscontent, FIRST (bbsmain. bbsname) AS bbsname, COUNT へ 
(bbsref. bbsmairII] AS ReturnNum, MAX (bbsref. bbstime) AS LatesTime 一 
FROM bbsmain LEFT OUTER JOIN bbsref ON 

bbsmain. bbsID=bbsref. bbsmainIl 
OUP BY bbsmain. bbsID 














: 表格 添加 到 SQL: 
四 内 视图 [ swcr | 


半 预存 过 程 ーー 


URIER BY 








图 7-51 修改 SQL 语句 


切换 到 代码 窗口 ， 在 代码 第 6 行 中 加 入 请 求 变 量 代码 keyword=request 
("keyword")， 如 图 7-52 所 示 。 


pp ry rs 9 


| ma tla. cig 
A rE= WEBPCRIFT LUNE ES RW Ky 
LP LU Le ,, TU Lena EE ss ニー 。 





















| 末 
= ke Fadat | 上 | 
党 加 1 
rub cwd, rtiwmConnrerttom = MD dsnforum STRINS 
FEB end (emmardTeat = "SELECT bhgmatn hm, FNST [bbemmir, bbstime) AT bbetime, ETRST tbhemuin, bhahute} AS 


pbh1t ぎ 。 ElfiST fbhbrugun. bbetitlel Fs bhetutle, FIRST (khanhin. kbarll AS bemurl, FIFRST bibemun. bboyeyilih A 
hhawmwt Ll, FIRST hlamnain, hbase A3 hasmr。 FIRST (Ehamrman- bhafacnml FS Mtacn, FRST (hhemnin, blrroomntent} A 
hhaeuntent, FIRST Thhemnih, bbastnmmi MS hbenamns, CUNT IEharmF. bhismay lh A Weturnba, MAN Chberef. ht am NS LataeTime 
FO bhemmsmn LEFT OUITEE TOTH Engrmf OW bbemaim.bbeTlmhhrrw『_ bhoemainth FEKHR khriitle 11km 时 SE BY 
hmatn. bleih” 

EBS cmd, Teh = EE 


at rsBe = rhb cmd Erecute 
EFD miows = 山 

早产 
1 








引 
| 


HE MFP 
7-52 加 入 请 求 变 量 代 码 


以上 没 定 完成 后 , forum.asp 系统 主页 面 则 具有 查询 功能 ， 按 (F12) 筆 可 以 打 
开 至 浏览 需 测 试 得 询 功 能 设置 是 否 正 确 。 首 先 forum.asp 页 面 将 显示 所 有 网 站 中 的 讨论 主 
题 ， 如 图 7-53 所 示 。 


下 立 骨 条 本 四 iiE ロ nf Lanteenet 世古 記 上 中 FE 
高 伞 站 1 月 各 站) 证 看 站 星矢 册 工員 h 和 号) 


Gm OO- 回 回 由記 末富 る 所 


Br TE | 


球 灶 文化 艺术 、 時 ペペ ーー 


RSE EE 文化 超市 时 尚文 化 文化 产业 : 











王 滞 下 属 : 宮守 EL 『 財 世 理 
吾 填 重 屋 1 | 


了 本 属 下 凡生 本 开 昌 st bn 由 的 :三 mm 自画 


已 区 掉 出 症 Ht 中 国生 再 ee WON: 1 mm MH: 


ーー F 


-YY 


玉井 変 攻 基 素 WW | i し 時 回 表 | 得 村 看 上 且 | 拭 箇 王政 [邮局 


Ca ir a Kr 本 Lh asa 


ーー 
聘 素 奋 谓 -0PMr 届 性 志 parrFT 





























Ta 


图 7-53 主页 面 浏 览 效果 









一 和 
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在 关键 词 中 和 输入 “亏本 ”并 单 击 “ 奉 询 ” 按 钮 ， 如 果 发 现 页 面 中 上 只 显示 市 
术 ” 关 键 子 的 主题 ， 则 说 明 查 询 功 能 设置 成 功 ， 僵 询 效 果 如 图 7-54 所 示 。 


p 了 Hicrosoftt Internet Hsploter ep la 区 
文 六 加 病 橋 GE) 可 看 0 路 认 0) 工具 中 帮 册 人 0 Fu 





Om の DAG の ee の ピ - あ に ・J 記 る 


きき | > NT 00 Um ers sig hp i DCE AG Hob LF 


丈 呈 文代 区 不 


智慧 天 地 文化 超市 时 尚文 化 文化 产业 文化 博览 


7-54 测试 查询 效果 


| Section_ 





论坛 浏 帘 页 面 





Ea 


在 论坛 系统 中 ， 供 网 站 浏览 者 使 用 的 页 面 有 讨论 主题 评 细 内 容 页 面 detail.asp 和 回复 主 


題 由 面 reforum.asp， 本 廊 将 介绍 如 何 制作 这 两 个 动态 页 面 。 


7 讨论 主题 详细 内 容 页 面 














讨论 主题 详细 内 容 页 面 detail.asp 的 主要 功能 是 显示 主题 的 详细 内 容 ， 这 个 页 面 用 于 显 





示 讨 论 主题 的 详细 内 容 和 所 有 回复 者 的 回复 内 容 ， 其 版 面 设计 如 网 7-35 所 示 。 


DewzO7Mforweeteti sp Caan ーー 


Gy tsnforw. asp siyle ess 
まで 4 hd 叶 ぐさ 













4i 主 起; :Baws 


环 语文 化 艺术 
DRS CLE TCR 





[sdr) Ovi) Ya [hE ho vy gw S23v 201 kK /5 秒 情 休 中文 552312) 


图 7-55 讨论 主题 详细 内 容 页 面 设计 














第 7 章 “全 二 人 生生 生生 





具体 制作 步骤 如 下 : 

在 detail.asp 由 和 面 中 要 同时 显示 讨论 主题 与 回复 主题 的 内 容 ， 因 此 需要 把 两 个 
数据 表 进行 合并 ， 一 次 取得 这 两 个 数据 表 中 的 所 有 字段， 并 且 根 据 主题 页 面 传送 过 来 的 URL ] 
参数 bbsID 进行 利 选 。 单 击 “ 绑 定 ” 面 板 ， 并 在 面板 中 单 击 加 号 “十 ”按钮 ， 在 弹出 的 菜 ( あ ) 
单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 。 站 和 

打开 “记录 集 ” 对 话 框 ， 单 击 “局 级 ”按钮 ， 进 入 记录 集 局 级 设 定 矶 面 ， 将 
現有 的 SQL 语句 改 成 以 下 的 SQL 语句 如 图 7-56 所 示 。 

01. SELECT bbsmain.*,bbsref.*FROM 

02. bbsmam LEFT OUTER JOIN bbsref ON 

03. bbsmam.bbsID=bbsret.bbsmamlD 

04. WHERE 

05. bbsmam.bbsID = queryID 





























名 称 : 
连接: dsnforum ~ 


SQL: SELECT bbsmain. *, bbsref.* 
FROM bbsmain LEFT OUTER JOIN bbsref ON 
bbsmain. bbsIlN=bbsref. bbsmainIl 
WHERE bbsmain. bbsID = quervyIl 


- 财 口 





辣 表 格 添加 到 SaL: 


日 内 袖 加 
田 关 ”预存 过 程 ーー 


DRDER EY 








图 7-56 改写 SQL 语句 


上 图 中 设置 了 一 个 名 为 queryID 的 变量 值 ， 并 且 将 其 设 为 request.querystring(“bbsID”) 传 
递 过 来 的 参数 。 

SQL 语句 说 明 : 

同样 用 LEFT OUTER JOIN 关联 bbsmain 和 bbsref 中 的 字段 ， 取 得 两 个 数据 表 中 的 相关 
数据 。 并 且 用 WHERE 语句 ， 往 选 bbsmain 数据 表 中 的 bbsID 字段 值 等 于 传递 过 来 的 bbsID 
的 値 。 

设 定 完 上 面 记 录 集 绑 定 后 ， 接 下 来 把 记录 集 detail 中 的 字段 插入 到 页 面 中 ， 
两 个 图 像 占 位 符 分 别 绑 定 发 布 人 性 别 形象 bbssex 和 回复 人 性 别 形象 bbsrefsex， 其 结果 如 
TT 















ー ビデ 」 
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ED: chapoTh forumidetail. asp GHTML)* |X 


HA dsnforum. asp style. css 
に つ 1 EE i 一 i 1 


a 


: {dstai1.bbscontenti 


» 
» 
* 


~ 


河 龟 内容 : {detail. bbsrefcontent} 


必 


A 人 
了 讲 ドロ 区 < 本 网 动态 -| 关于 我 们 十 请 上告 服务 _ | _ 设 为 首页 | 志恒 链接 -| 类 未 招聘 


ES EL ER Coapyright @ 2000-2008 环 博 让 化 艺 术 ALL Rights Réserved. 
联系 电话 : n1n-123458 巷 真 :010-654321 


图 | 加 | 网 
<body> <divinid> kG 100% v933 x 523y 201K ア 5 秒 筒 体 中 文 (GB2312) 








7-$7 detail 中 的 字段 插入 


单 击 选择 主题 表格 中 的 文字 “电子 邮件 ”， 然 后 单 击 “ 属 性 ”面板 中 的 “ 链 
接 ” 文 本 框 后 面 的 “浏览 文件 ”按钮 回 ， 打 开 “ 选 择 文件 ”对 话 框 ， 在 该 对 话 框 中 单 击 选择 
“数据 源 ” 单 选 按钮 ， 然 后 在 “ 域 ”列表 框 中 单 击 选择 “记录 集 (detail)” 中 的 bbsemail 字 
段 , 井 且 在 URL 链接 前 面 加 上 mailto:， 设 置 如 图 7-58 所 示 。 


选取 文件 名 自 〇 文件 系统 站 点 和 服务 器 ... 
中 数 指 渡 





域 : | 日 多 ”记录 集 (detail) 

i bbsID 

: bbstitle 
bbscontent 
bbsname 
bbstime 
bbsface 
bbssex 


bbsurl 
bbshits 
bbsmalirD 





格式 : 无 
URL: mailto: <%= (detail. Fields. Item ("bbsemail"). Value)%> 
在 站 点 定 尺 中 更 改 默 认 的 链接 相对 于 














7-S8 ”设置 Email 的 链接 


单 击 选择 主题 表格 中 的 文字 “主页 ”， 单 击 “ 属 性 ”面板 中 的 “链接 ”文本 框 
后 面 的 “浏览 文件 ”按钮 回 ， 打 开 “ 选 择 文件 ”对 话 框 ， 在 该 对 话 框 中 单 击 选择 “数据 源 ” 
单 选 按钮 ， 然 后 在 “ 域 ” 列 表 框 中 单 击 选择 “记录 集 (detail)” 中 的 bbsurl 字段 ， 并 且 在 
URL 链接 前 面 加 上 http:/， 设 置 如 网 7-59 所 示 。 

















选取 文件 名 自 O 〇 文件 系统 站 点 和 服务 器 
全 数 措 江 


bbsID 
bbstitle 


域 : | 日 隐 ”记录 集 (detail) 


bbscontent 
bbsname 
bbstime 
bbsface 
bbssex 
bbsemail 


bbshits 
bbsmainIl 





格式 : | 无 











URL: http <%= (detail. Fields. Item ("bbsurl"). Yalue)%> 
在 站 点 定义 中 更 改 默 认 的 链接 相对 于 








图 7-59 设置 URL 链接 
用 第 (4) 步 和 第 (5) 步 的 方法 ， 设 置 其 回复 人 的 “电子 邮件 ”和 “主页 ”的 
链接 。 得 到 效果 如 图 7-60 所 示 。 


Dp ens \ form\ dntatl ssp (XHTHL)S 


[ETALD dsnforem, asyp style. ess 








エエ オミ エイ エエ エミ エエ エイ ドミ エイ で エエ ナイ そそ テイ ナイ エエ で で で す エ イエイ エミ エミ エイド ミエ エミ ナナ テテ ミミ トミ エミ エド よ ミエ イド エド エミ ミエ ミエ オミ エミ ミエ ミエ ミア エナ ミエ ミエ イエ エミ ミエ ミト エド トド ミミ ミエ ミエ ミミ ミミ エイド エイ ミナ ミナ ドナ イミ コマ イミ すす 
: 


OER: Catail Latitle : 他 Raw 工 思 


aswtaii.Sbacostesat 


Gm し 4 


Sn» 


环 谤 文化 芝 术 0 お | メサ ネ 瞧 最 贡 _】 设 为 首页 六 请 涟 塘 | 人 放 徐 
DC TR ym 





1 と ここ ーー ムー ーー ーー いこ 为 
brdy> ti veni dy div ah [hG oo -9 vy MATETS KC MES SE) 


7-60 绑 定 记录 集 Email 和 URL 





单 击 选择 文字 “回复 主题 ” 单 击 “ 服 务 器 行为 ”面板 中 的 “ 转 到 详细 页 面 ” 
功能 选项 ， 打 开 “ 转 到 详细 页 面 ”对 话 框 ， 按 图 7-61 所 示 进 行 设置 。 


链接 : “回复 主题 " 
详细 信息 页 : reforum. asp | 
传递 URL 参 数 : bbsTn 设置 为 以 下 项 的 值 
记录 集 : | detail v| 
A [mn = 
传递 现 有 参数 : | ] umr 参数 
[| 表单 参数 





























7-61 设置 “ 转 到 详细 页 和 面 ” 对 话 杠 





时 时 っ i ミ ( { x i 。 ーー - 二 统 
有 = 和香 多 二 材 ] 出 可 | 四 - ‘ TE 到 系 Fj 


の 
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讨论 主题 中 的 回复 留言 可 能 不 只 一 条 ， 而 目前 的 设 定 则 只 能 显示 回复 主题 留言 
的 第 一 条 数据 ， 因 此 需要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 的 设置 ， 单 击 detail.asp 页 
面 中 要 重复 的 记录 列 ， 如 图 7-62 所 示 。 














河 复 内 容 : {detailbbsrefcontent} 


» 
» 





图 7-62 ”选择 要 重复 的 单元 格 





单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 右 行 为 ”和 面板， 并 在 面板 中 单 击 加 号 
“十 ”按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ” 选 项 。 

打开 “重复 区 域 ” 对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 单 击 “ 确 
定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选取 要 重复 的 区 域 左 上 角 出 现 了 一 个 “重复 ”的 灰色 
标签 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 网 7-63 所 示 。 
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图 7-63 设置 “重复 区 域 ”对 话 框 及 效果 





加 入 “记录 集 导 航 条 ”功能 。 把 鼠标 移 至 要 加 入 “记录 和 集 导航 条 ”的 位 置 ， 单 
击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导 航 条 ”按钮 全 |。 

打开 “记录 集 导航 条 ”对 话 框 ， 单 击 选择 “记录 集 ” 后 面 的 下 拉 三 角 按钮 ， 在 展 
开 的 菜单 中 选择 detail 记录 集 ， 然 后 再 单 击 选择 “显示 方式 ”为 “文本 ” 单 选 按钮 ， 最 后 单 击 
“确定 ”按钮 回 到 编辑 页 面 ， 页 面 中 将 自动 插入 记录 集 导 航 条 ， 如 图 7-64 所 示 。 





























记录 和 集 导航 条 
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2 ke Nv 生生 』 
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图 7-64 添加 记录 集 导航 条 





设置 后 击 次 妆 | 


在 论坛 讨论 主页 面 中 有 一 个 “阅读 ”的 统计 项 ， 当 浏览 者 单 击 标题 进入 得 看 内 容 时 ， 阅 














读 总 数 就 要 增加 一 次 。 其 功能 的 实现 方法 在 于 更 新 数据 表 bbsmain 里 的 bbshits 字段 。 详 细 操 
作 步 又 如 下 : 

打开 文件 detail.asp， 在 “应 用 程序 ”面板 中 的 “服务 器 行为 ”面板 中 选择 “ 命 
令 ” 选 项 。 打 开 “ 命 令 ” 对 话 框 ， 如 图 7-65 所 示 。 






一 CR) 
司 口 返 国 内 有 以 下 名 和 2i 孚 拓 ， 


图 7-65 打开 “命令 ”对 话 框 
在 打开 的 “命令 ”对 话 框 中 ， 设 置 “ 名 称 ” 为 cmdhits,“ 类 型 ”为 更 新 。SQL 





文本 域 中 输入 以 下 SQL 语句 。 
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01.UPDATE bbsmain 
02.SET bbshits = bbshits + 1 


03.WHERE bbsID = hitID 
单 击 选择 “命令 ”对 话 框 中 的 “变量 ”后 面 的 “增加 变量 ”加 号 “十 ”按钮 ， 
添加 hitID 变量， 设置 值 为 Request.QueryString("bbsID")， 设 置 如 图 7-66 所 示 。 











:lemdhits 连接 : | snforum 
: | 更 新 ~ [返回 具有 以 下 名 称 的 记录 集 : 
: UFDATE bbsm 


SET tbshits = = bbshits † 1 
WHERE bbsID = hitID 









































Request. QueryString ("bbsID") 


添加 到 SaL: 


类 ”预存 过 程 ーー 








7-66 设置 “命令 ”对 话 框 


说 明 : 
hitID 为 SQL 用 来 识别 回复 的 变量 。 其 值 等 于 当前 网 页 所 显示 的 主题 编号 。 








潮 增 讨论 主题 页 面 forum add.asp 主要 功能 是 将 页 面 的 表单 数据 新 增 到 站 点 的 数据 库 
中 ， 页 面 设计 如 图 7-67 所 示 。 


中 D: tchap0Ttforumtforum_add.asp CXHTML)* 



































^ 
- 





< | | > 
<body> <divinid> <div. show> [RJ GQ 100% v933 x 523v 213 K / 5 秒 简体 中 文 (562312) 











7-67 ”新 增 讨 论 页 面 效 末 图 
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详细 操作 步骤 如 下 : 

在 图 7-67 中 加 入 了 一 个 隐藏 区 域 ， 设 置 “ 隐 藏 区域 ”名 称 为 bbshits， 并 设置 
“ 值 ”为 默认 值 1， 这 样 操作 是 为 了 实现 提交 增加 主题 时 ， 数 据 库 中 能 让 “阅读 ”的 次 数 设 置 。 
为 1 次， 隐藏 区 域 的 “属性 ”面板 设置 如 图 7-68 所 示 。 OO) 


隐 若 区 域 
IN bbshits 值 ) 1 多 





图 7-68 加入 bbshits 隐藏 区 域 


新 讨论 主题 的 表单 提交 前 ， 要 为 这 个 表单 加 入 “ 检 碍 表单 ”的 动作 ， 这 样 能 保 
证 插入 到 数据 库 的 数据 都 是 有 实际 数据 的 ， 单 击 <forml> 标 签 ， 然 后 单 击 “ 服 务 器 行为 ” 面 
板 中 的 “十 ”号 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 检 验 表 单 ” 选 项 。 

打开 “ 检 和 碍 表单 ”对 话 框 ， 设 置 所 有 字段 “ 值 ” 为 “必需 的 >， 并 设置 相应 的 
“可 接受 ”范围 ， 有 具体 参数 如 图 7-69 所 示 。 

















可 接受 〇 有 〇 “任何 东 西 〇 数字 
@@ ”电子 邮件 地 址 〇 数字 从 | 到 








图 7-69 设置 检查 表单 


单 击 “确定 ”按钮 完成 检 奋 表单 的 操作 。 上 只 有 加 入 “插入 记录 ”服务 器 行为 ， 
才能 将 新 的 讨论 主题 新 增 人 至 数据 表 bbsmain 中 。 执 行 荣 单 栏 中 的 “窗口 ”一 “服务 器 行为 ” 
命令 ， 打 开 “ 服 务 右 行为 ”面板 。 蛙 击 该 面板 中 的 “+” 写 按钮 ， 从 打开 的 采 单 中 选择 “ 插 
入 记录 ”命令 ， 同 该 网 页 搬入 记录 的 服务 带 行 为 。 

在 “插入 记录 ”对 话 框 中 ， 按 下 面 的 参数 进行 设置 ， 如 网 7-70 所 示 。 





连接 : マ 
插 太 到 表格 : bbsmain 图 
插入 后 ， 转 到 : |forum. asp 
获取 值 自 : 0T 
表单 元 来 :EE ns 
Se 种 公允 中 base 
ce 本 入 到 列 中 “も 





本 ) 
DSE "(区 本 ) 
et ee ( 立 本 ) 
bbsur1 插 六 到 列 中 ”bbsur1” ( 立 本 ) 


列 : bbstit1s 





图 7-70 设置 “搬入 记录 ”对 话 框 
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@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 连接 对 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 bbsmain 数据 表 。 

@ 在 “插入 后 ， 转 到 :” 栏 中 输入 forum.asp， 表 示 揪 入 成 功 后 返回 该 页 面 。 

@ 从 “获取 值 目 ”下 拉 有 玉音 中 选择 建立 的 forml 表单 对 象 。 

@ 在 “表单 元 素 ” 列 表 框 中 把 表单 中 的 字段 和 数据 库 中 的 学 段 一 一 对 应 。 

单 击 “确定 ”按钮 回 到 网 页 设计 编辑 页 面 ， 这 样 就 完成 了 插入 主题 页 面 
forum add.asp 的 设计 了 ， 完 成 后 的 效果 如 图 7-71 所 示 。 


er = 器 黄 


[AAD smteee ep 























EL cm 
| 





に に ーー 2 上 
dr in Iow 了 中 


7-71 ”完成 插入 记录 的 效 来 


7 和 回复 讨论 主题 页 面 ] 


回复 讨论 主题 页 面 reforum.asp 的 设计 必定 相似 ， 主 要 功能 是 
将 页 面 的 表单 数据 新 增 到 网 站 的 bbsref 数据 表 中 。 它 的 版 面 设计 如 图 7-72 所 示 。 


a ms CTH = 


Er Eee sr 


















mm ct 


* ーー すず 


环 说 文化 艺 术 a 、 計 TT 下 刺 [ 事 素 TE T 間 MMW 





“| 


让 = と 1 La 
| el iw. hm ET a Ei ri ss a04 i [Ts 芋 中 fsEedi2 





7-72 回复 讨论 主题 页 面 设计 











第 7 诗 症 C33EY 开 于 





创建 好 静态 页 面 后 ， 单 击 “ 绑 定 ”面板 中 的 “十 ”号 按钮 ， 在 弹出 的 菜单 中 ， 
选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 
定 ” 按 钮 完成 设 定 ， 如 图 7-73 所 示 。 





























@ 在 “名 称 ”文本 框 中 输入 rsmain 作为 该 记录 集 的 名 称 。 O)) 
@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 由 
e 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 要 





e 在 “ 列 ”选项 组 中 选择 “ 选 定 的 ” 单 选 按钮 ， 选 择 bbsID 字段 。 
e 设置 “ 簿 选 ” 的 条 件 为 “bbsID=URL 参 数 (bbsID 
@ 将 “排序 ”设置 为 “无 ” 


名 称 : ksnain gg 
和 连接: EPE 
表格 : |bbsmain 











列 : 〇 全 部 ② 选 定 的 : 























图 7-73 设 定 rsmain“ 记 录 集 ” 





加 入 了 一 个 隐藏 区 域 ， 单 击 选择 该 隐藏 区 域 ， 在 “属性 ”面板 中 单 击 “ 动 态 数 
据 值 ”按钮 锋 ， 打 开 “ 动 态 数据 ”对 话 框 ， 单 击 选择 “ 域 ”列表 框 中 的 “记录 集 
(Crsmain)”， 在 展开 的 列 选 项 中 选择 “bbsID” 选 项 ， 单 击 “ 确 定 ” 按 钮 ， 则 将 bbsID 绑 定 到 
隐藏 区 域 的 “ 值 ” 中 。 设 置 如 图 7-74 所 示 。 





7 ”[ 第 一 个 记录 索引 ] 取消 


7 。 [最 后 一 个 记录 索引 ] 
7 [总 记录 数 ] 





格式 : 无 マ 


代码 : | < (rsmain. Fields. Item ("bbsTD") 











RE Ra 
II 询 阅 区 域 
aoi 攻略 [ee Gronain Pields Tten (ChbsTD" | 几 


图 7-74 加 入 隐藏 区 域 并 设置 动态 值 
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与 讨论 主题 一 样 ， 回 复 主题 的 表单 提交 前 要 为 这 个 表单 加 入 “检验 表单 ”的 动 
作 ， 单 击 <forml> 标 签 ， 再 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “十 ”按钮 。 在 弹出 的 菜单 
中 ， 选 择 “ 检 验 表单 ” 选项， 打开“ 检查 表单 ”对 话 框 ， 设 置 所 有 字段 值 为 “必需 的 ” 并 
设置 相应 的 “可 接受 ”范围 ， 如 图 7-75 所 示 。 

















Eh nut Gi sr emuame 5 EK) 





5 inpmat " "bbsrefurl” [RY 
textarea "bbsrefcontent" EE 





值 : 必需 的 


可 接受 : “2 任何 东西 [数字 
加 电子 邮件 地 址 〇 数字 从 | | 到 [ | 








图 7-75 设置 检查 表单 


单 击 “ 确 定 ” 按 钮 完成 检查 表单 的 操作 。 只 有 加 入 “插入 记录 ”服务 器 行为 ， 
才能 将 新 的 讨论 主题 新 增 至 数据 表 bbsref 中 。 执 行 “ 服 务 器 行为 ”面板 中 的 “插入 记录 ” 命 

， 打 开 “ 搬 入 记录 ”对 话 框 ， 按 下 面 的 参数 进行 设置 ， 如 图 7-76 所 示 。 

@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 连接 对 有 象 。 

@ 从 “插入 到 表格 ”下 拉 列 表 中 选择 bbsref 数据 表 。 

@ 在 “插入 后 ， 转 到 :” 栏 中 输入 jforumy/forum.asp， 表 示 插 入 成 功 后 返回 该 页 面 。 

@ 从 “获取 值 目 ” 下 拉 玉 单 中 选择 建立 的 forml 表单 对 象 。 

@ 在 “表单 元 素 ”列表 框 中 把 表单 中 的 字段 和 数据 库 中 的 字段 一 一 对 应 。 

















[五 下 


柄 . 尺 到 | 表格: bbsref し 取消 | 
a ssp EL 


获 职 值 自 : | fornl 三 提 变 时 ) 
表单 元 素 : は 中.」 













































































图 7-76 设置 “搬入 记录 ”对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 完 成 回复 讨论 页 面 reforum.asp 的 设计 ， 如 
7-77 所 示 。 








中 ni: い chapnTtforumtreforum.asp 【YHTL) = EX 


CE dsnforum.asp style.css 守 


环 次 文化 艺术 ， 





/ a 
请 
ーーー ー ーー -~ a 
KW 
PJ 
r ェ ー ~ - 























| | 
<body> <divw#top> kmQ Io0% v933 x 523v 208 /5 秒 簡体 中 文 (GB2312) 








图 7-77 ”完成 的 效 琳 








为 论坛 开发 一 个 后 台 管 理 功 能 也 是 必要 的 。 管 理 者 通过 合法 号 份 登录 后 ， 可 以 实现 对 讨 
论 主 题 的 修改 、 删 除 以 及 删除 回复 内 容 功 能 。 从 动态 功能 上 短 层 ， 实 现 这 些 功能 主要 也 是 通 
过 “服务 需 行 为 ”面板 中 的 “更 新 记录 ”和 “删除 记录 ”实现 。 


人 后 人 台 登 录 


由 于 管理 者 接口 是 不 允许 网 站 浏览 者 进入 的 ， 必 须 进行 权限 的 设置 。 

详细 制作 步骤 如 下 : 

局 动 Dreamweaver CS53， 执 行 菜 单 栏 中 的 “文件 ”一 “新 建 ” 命 令 ， 打 开 “ 新 
建文 档 ” 对 话 框 ， 选 择 “ 空 白 页 ”选项 卡 中 的 “页 面 类 型 ”列表 框 下 的 ASP VBScript 选 
项 ， 在 “布局 ”列表 框 中 选择 “无 ”选项 ， 然 后 用 鼠标 单 击 “ 创 建 ”按钮 创建 新 页 面 ， 输 入 
网 页 标题 “BBS 后 台 管 理 登录 ”， 执 行 菜单 栏 中 的 “文件 ”一 “保存 ”命令 ， 在 站 点 中 将 该 
文档 保存 为 admin login.asp。 

执行 菜单 栏 中 的 “插入 ”一 “表单 ”一 “表单 ”命令 ， 插 入 一 个 表单 。 

将 鼠标 指针 放置 在 该 表单 中 ， 执 行 菜 单 栏 中 的 “插入 ”一 “表格 ”命令 ， 打 开 
“表格 ”对 话 框 ， 在 “ 行 数 ”文本 框 中 输入 需要 插入 表格 的 行 数 为 4。 在 “ 列 数 ” 文 本 框 中 输 
入 需要 插入 表格 的 列 数 为 2。 在 “表格 宽度 ”文本 框 中 输入 400 像素 。 其 他 参数 保持 默认 
值 ， 如 图 7-78 所 示 。 

单 击 “ 确 定 ”按钮 ， 在 该 表单 中 插入 4 行 2 列 的 表格 ， 选 择 表格 在 “属性 ” 面 
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板 中 设 症 对 齐 方式 为 大 中 对 章 。 单 击 鼠 标 左 键 并 拖 忠 鼠标 选中 第 1 行 表 格 ， 选 中 表格 的 第 1 
行 后 ， 在 “属性 ”面板 中 单 击 “合并 所 选单 元 格 ， 使 用 跨度 ”按钮 中， 将 第 1 行 表格 合 
并 。 用 同样 的 方法 把 第 4 行 合并 。 


行 数 :4 | 列 肖 
表格 宽度 
边框 粗细 : 0 ”| 情 素 
单元 格 过 距 : 0 | 
单元 格 间距 : 0 | 


辅助 功能 
标题 : 


对 齐 标题 


确定 





图 7-78 插入 表格 


在 该 表单 中 的 第 一 行 中 输入 文字 “BBS 后 台 管 理 登录 页 面 ” 在 表格 的 第 2 行 
中 的 第 1 个 单元 格 中 输入 文字 说 明 “ 用 户 :” 在 表格 的 第 2 行 中 的 第 2 个 单元 格 中 单 击 “ 文 
本 域 ” 投 钮 四， 插入 单行 文本 域 表 单 对 象 ， 定 义 文 本 域名 为 username。“ 文 本 域 ” 属 性 设置 
及 此 时 的 效果 如 图 7-79 所 示 。 


三 | 
加 文本 域 字符 宽度 0) 类 型 由 单行 (8) 〇 多 行 〇 密 品 @) 美 C) | 无 v 
最 多 字符 数 初始 值 加 ) 多 
」 禁 用 Q) 
口 只 读 @) 


























| ni channrtforumtadmin_ 1ogin.asp [XHTML)* ーー 口 其 








图 7-79 插入 “文本 域 ” 的 设置 和 效果 网 
在 第 3 列表 格 中 输入 文字 说 明 “ 密 码 : ” 在 表格 的 第 3 列 中 的 第 2 个 单元 格 中 











单 击 “ 文 本 域 ”按钮 四， 插入 单行 文本 域 表 单 对 象 ， 定 义 文 本 域名 为 password。“ 文本 域 ” 
属性 设置 及 此 时 的 效果 如 图 7-80 所 示 。 

















1 
区 文大 字符 宽度 由 | | 美 型 〇 単行 @ 〇 多 行 ⑪ 。 〇 密码 类 @| 无 YW|@ 


最 多 字符 数 初午 | ーー タイ 2 
器 禁用 四 ) 
画す 
守 ni い chapOTVfoyumtadmin_1ogin. asp CKHTML)* le 





后 台 管 理 





> <form. ><table> く tr><td> | 9 100% vv574dxl73v2K1 秒 简体 中 文 (GE2312) 


7-80 插入 “文本 域 ” 的 设置 及 效果 


单 击 选择 第 4 行 单元 格 ， 执 行 染 单 栏 中 的 “插入 ”一 “表单 ”一 “按钮 ” 命 
令 ， 重 复 执 行 一 次 则 插入 两 个 按钮 ， 并 分 别 在 “属性 ”面板 中 进行 属性 变更 ， 一 个 将 “ 值 ” 
设置 为 “登录 “动作 ”设置 为 “ 提 区 表单 ” 单 选 按钮 ， 忆 一 个 将 “ 值 ” 设 置 为 “ 重 放 ”将 
“动作 ”设置 为 “ 重 设 表单 ” 单 选 按钮 ,“ 属 性 ”的 设置 及 效果 如 图 7-81 所 示 。 
we = 


按钮 名 称 値 ⑩ 动作 で 提交 表单 GE) 〇 元 类 加 | 无 A 
〇 重役 表 単 (8) 





操作 





按钮 名 称 值 四 动作 〇 ) 提交 表单 G) 〇 元 ⑱ 类 加 | 无 A 
四 重 设 表单 @) 


TD tchannrtforumtadmin login. asp [XHTML)* - 口 其 


后 台 管 理 





“hody? “Form#forml » T4173w 2 /1 秘 | 简体 中 让 (6B2312) | 
图 7-81 设置 按钮 名 称 的 属性 及 效果 


单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 [ 团 号 按钮 ， 在 弹出 的 菜 
单列 表 中 选择 “用 户 身 份 验证 /登录 用 户 ” 选 项 。 
打开 “登录 用 户 ” 对 话 框 ， 进 行 如 下 设置 : 
@ 从 “从 表单 获取 输入 ”下 拉 列 表 中 选择 该 服务 器 行为 使 用 网 页 中 的 forml 表 単 対象 中 
浏览 者 填写 的 对 象 。 
@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 username 对 象 ， 设 定 该 用 户 登 录 服 务 器 行 
为 的 用 户 名 数据 来 源 为 表单 的 username 文本 域 中 浏览 者 输入 的 内 容 。 
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@ 从 “密码 字段 ”下 拉 列 表 中 选择 文本 域 password 对 象 ， 设 定 访 用户 登录 服务 器 行为 
的 用 户 名 数据 来 源 为 表单 的 password 文本 域 中 浏览 者 输入 的 内 容 。 

@ 从 “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
dsnforum。 

@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 需 行为 使 用 到 的 数据 库 表 对 象 为 admin。 

@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 admin 存储 用 户 名 的 字段 为 username 字段 。 

@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 admin 存储 用 户 密码 的 字段 为 password 字段 。 

@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 回 /forumy/admin.asp 页 面 。 

@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 同人 /forumyforum.asp 负面。 

@ 选中 “基于 以 下 项 限制 访问 ”后 面 的 “用 户 名 和 密码 ” 单 选 按钮 。 

设置 如 图 7-82 所 示 。 



























































从 表单 获取 输入 : 
用 户 名 字段 : |username 
密码 字段 : password 
使 用 连接 验证 : | dsnforun 
表格 : | admin 
用 戸 名 列 : username v| 
密码 列 : password vy 








如 果 登 录 成 功 ， 转 到 : /forum/ admin. asp 训 览 ... 


し | 转 到 前 一 个 URL 如 果 它 存在 ) 
如 果 登 录 失败 ， 转 到 |: /forum/ forum. asp 训 览 .. 








基于 以 下 项 限制 访问 : (や 用 户 名 和 窗 码 
〇 ”用户 名 、 密 码 和 访问 级 别 
获 职 级 别 自 : 





图 7-82 登录 用 户 的 设 定 


执行 菜单 栏 中 的 “窗口 ”一 “行为 ”命令 ， 打 开 “ 服 务 器 行为 ”面板 ， 单 击 
iA 面板 中 的 加 号 “十 ”号 按钮 ， 在 打开 的 行为 列表 中 选择 “检查 表单 ” 命 

， 打 开 “ 检 查 表单 ”对 话 框 ， 设 置 username 和 password 文 本 域 的 “ 値 ” 都 为 “必需 的 网 
“可 接受 ， 为 “任何 东西 ” 单 选 按钮 。 如 图 7-83 所 示 。 

















input "username (RK) 
. ~ ~ 


可 接受 : (や 任 何 未 丁 〇 数字 
〇 ) 电子 邮件 地 址 ”C 〇 数字 从 





图 7-83 设置 检查 表单 











单 击 “确定 ”按钮 回 到 编辑 页 面 ， 管 理 者 登录 页 面 admin login.asp 的 制作 已 
经 完成 ， 完 成 后 的 效果 如 图 7-84 所 示 。 


| D: (channrtforumtadmin login. asp [XHTHL) -口头 会 








‘hody? <form#forml> T4149w EA1 秘 简体 中 训 人 B2312) 








图 7-84 设置 管理 者 登录 界面 


7.5.2 


admin.asp 页 面 是 管理 者 登录 成 功 后 转 癌 的 管理 主页 面 。 这 个 页 面 的 主要 功能 是 显示 所 
有 讨论 主题 的 标题 ， 并 为 管理 者 提供 删除 和 修改 的 功能 。 管 理 主页 面 admin.asp 的 内 容 设 计 
与 系统 主页 面 forum.asp 大 致 相同 ， 不 同 的 是 加 入 可 以 转 到 所 编辑 页 面 的 链接 “修改 ”和 
“删除 ” 静态 部 分 的 设计 如 图 7-85 所 示 。 


En: \chapoT\forumiadmin. asp (KHTML)* ~- x 


[ 雇 代 码 】 dsnforum. asp style.css 了 
i ‘ 了 時 a 7 が 人 | 


ie 
下 一 一 
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本 网 动态 |i 关于 我 们 二 请 年 服务 | 设 为 首页 | 友情 链接 :| 类 示 招 聘 司 


山 | | 





《 || 屠 | 
<body> <div#mid> [kGQ 100% v949 x 450v 200K/5 秒 | 簡体 中 立 (GB2312) 


图 7-85 版 主管 理 页 面 的 设计 


具体 制作 步骤 如 下 : 
创建 好 静态 部 分 网 页 后 单 击 “ 绑 定 ”面板 中 的 “十 ”号 按钮 [ 国 ， 在 弹出 的 菜 
单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 。 
打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 ， 
如 图 7-86 所 示 。 














アブ Dreamweaver CSSTASP 动态 网 站 建设 从 入 门 到 精通 





@ 在 “名 称 ” 文 本 框 中 输入 rsBB 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 

@ 从 “和 表格” 下拉 列表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 
@ 从 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 讽 首 “和 饥 选 ”的 条 件 为 “无 ”。 

@ 设置 “排序 ”的 条 件 为 “无 ”。 
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单 击 “ 高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 的 页 面 ， 将 现 有 的 SQL 语句 改 成 以 


下 的 SQL 语句 ， 如 图 7-87 所 示 。 


着丈 : 融和 
名 称 : rsEE 这 稼 。 snferwm 量 | | 定 生 


和 连接: | dsnforum i LT bh LST Mbb 周 mal AS bhaTin 所 
一 一 PT hb bbalbt 四 5 MI et baer kbsT ls) 店 
b 


- aT la, EIEST tba baer LY Py url, i 
表 格 : 1 人 IT Wh 
ェ 上 本 iT 人 bbs ai bbsFmcml Br ta, ELET hbar ee EhHT TE 村 
列 で ) 全部 ( 〇 选 定 的 : 
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| nfngRmW | 


图 7-86 疫 定 rsBB 记录 集 图 7-87 改写 SQL 语句 


01. SELECT 
02. bbsMain.bbsID, 
03. FIRST (bbsMain.bbsTime) AS bbsTime, FIRST (bbsMain.bbsHits) AS bbsHits, 


04. FIRST (bbsMain.bbsTitle) AS bbsTitle,FIRST (bbsMam.bbsurl) AS bbsurl, 
(bbsMain.bbsemall) AS bbsemail,FIRST (bbsMain.bbssex) AS bbssex, 


(bbsMain.bbsFace) AS bbsFace, FIRST (bbsMain.bbsContent) AS bbsContent, 





FIRST 
FIRST 


05. FIRST (bbsMain.bbsName) AS bbsName,COUNT(bbsReft.bbsMamlD) AS ReturnNum, 


06. MAX(bbsRet.bbsIime) AS LatesIime 
07. FROM 

08. bbsMam LEFT OUTER JOIN bbsRef ON 
09. bbsMain.bbsID=bbsRef.bbsMainID 

10. GROUP BY bbsMain.bbsID 





比 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 forum.asp 页 面 的 适当 位 置 ， 如 图 


7-88 所 示 。 
选中 记录 集 有 数据 时 要 显示 的 单元 格 ， 如 图 7-89 所 示 。 





单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 ， 并 在 面板 中 单 击 “ 增 加 服务 














髓 行为 ”加 号 “十 ”按钮 ， 在 弹出 的 沫 单列 表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 不 为 空 





则 显示 区 域 ” 选 项 。 
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图 7-88 字段 的 绑 定 
图 sin [BD 3 
图 7-89 选择 要 显示 的 单元 格 


打开 “如 果 记 录 集 不 为 空 则 显示 区 域 ”对 话 框 ， 保 持 默认 值 ， 单 击 “ 确 定 ” 按 
钮 回 到 编辑 页 面 ， 则 发 现 之 前 所 选中 要 显示 的 区 域 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显 




















示 ...” 的 灰色 卷 标 ， 这 表示 已 经 完成 设置 ， 如 图 7-90 所 示 。 
训 果 记录 集 不 为 空 则 显示 区 域 
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[try 二 vi tiv. shew> [hie ho ~~ 90.0, DKS GPY ia 
图 7-90 ”如 末 数 据 集 不 为 空 则 显示 区 域 


根据 前 面 的 步骤 ， 将 “目前 没有 发 表 任何 主题 ”区 域 设 定 成 “如 果 数 据 集 为 空 
则 显示 区 域 ” 如 图 7-91 所 示 。 

单 击 forum.asp 页 面 中 要 重复 的 记录 所 在 的 表格 ， 如 图 7-92 所 示 。 

再 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“十 ”号 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 。 




















庆 琳 记 承 集 为 空 则 显示 区 城 
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图 7-91 如 果 数 据 集 为 空 则 显示 区 域 








7-92 选择 要 重复 的 列 


打开 “重复 区 域 ”对 话 框 ， 设 置 这 一 页 显示 的 数据 “记录 ”为 10， 单 击 “ 确 
定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 所 选中 要 重复 的 区 域 左 上 角 出 现 了 一 个 “重复 ”的 灰色 
标签 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 网 7-93 所 示 。 
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7-93 ”设置 “重复 区 域 ” 
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接 下 来 我 们 要 插入 “记录 集 导 航 条 ” 把 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 
位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导 航 条 ”按钮 人 |。 

打开 “记录 集 导航 条 ”对 话 框 ， 单 击 选择 “记录 集 ” 后 面 的 下 拉 三 角 按钮 ， 在 展 
开 的 菜单 中 选择 rsBB 记录 集 ， 然 后 单 击 选择 “显示 方式 ”为 “文本 ” 单 选 按钮 ， 最 后 单 击 
“确定 ”按钮 回 到 编辑 页 面 ， 页 面 中 将 自动 插入 记录 集 的 导航 条 ， 如 图 7-94 所 示 。 




















记录 集 导航 条 
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图 7-94 添加 记录 集 导 航 条 
在 系统 管理 页 面 admin.asp 的 讨论 主题 中 加 上 “ 转 到 详细 页 面 ” 的 设 定 ， 是 为 
了 要 进入 讨论 主题 内 容 管理 页 面 delrefasp 进行 删除 回复 的 操作 。 首 先 选 中 页 面 中 的 标题 字 
段 {TrsBB.bbsTitle}， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 噩 行为 ”标签 中 的 加 号 “十 ” 鬼 


钮 ， 在 弹出 的 荣 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 
打开 “ 转 到 详细 页 面 ” 对 话 和 枉 ， 详 细 设置 如 图 7-95 所 示 。 














转 到 详细 页 面 


链接 : 
详细 信息 页 : /forum/ delref. asp 


传递 URL 参数 : bbsID 设置 池 以 下 项 的 值 
记录 集 : rsBB a 


列 : bbsID 


传递 现 有 参数 : [ ] URL 参 数 
| | 表单 参数 





图 7-95 设置 {rsBB.bbsTitle} 转 到 详细 页 面 


admin.asp 页 面 中 每 个 讨论 主题 后 面 都 各 有 一 个 “修改 ”和 “删除 ”按钮 ， 它 
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是 用 来 修改 和 删除 某 个 讨论 主题 的 ， 但 不 是 在 这 个 页 面 执行 ， 而 是 利用 “ 转 到 详细 页 面 ”的 
方式 ， 另 外 打开 一 个 页 面 来 执行 。 选 中 admin.asp 页 面 中 的 删除 按钮 ， 执 行 “ 服 务 器 行为 ” 
面板 中 的 “ 转 到 详细 页 面 ”功能 选项 。 

在 “ 转 到 详细 页 面 ”对 话 框 中 ， 详 细 设 置 如 图 7-96 所 示 。 





链接 : 
详细 信息 页 : /forumi deltitle. asp 


传递 URL 参 数 : bbsTn 设置 为 以 下 项 的 值 
记录 集 : rsBB マ 
列 : bbsTn マ 
己 暫 現有 参 数 : | | URL 参数 
| | 表单 参数 





图 7-9%6 设置 “删除 ” 转 到 详细 页 面 
用 同样 的 方法 。 设 置 “ 修 改 ” 按 钮 转 到 详细 页 面 adtitle.asp, 如 図 7-97 所 示 。 


链接 : 
详细 信息 页 : /forum/adtitle. asp 


传递 URL 参 数 : bbsTn 设置 为 以 下 项 的 值 
记录 集 : rsBB マ 
列 : bbsTn マ 
传递 现 有 参数 : | | URL 参数 
| | 表单 参数 





图 7-97 ”设置 “修改 ” 转 到 详细 页 而 


设置 限制 对 本 页 的 访问 功能 。 单 击 “ 应 用 程序 ”面板 中 “服务 器 行为 ”标签 中 加 号 
“十 ”按钮 。 在 弹出 的 染 单列 表 中 ， 选 择 “ 用 户 身 份 验证 /限制 对 页 的 访问 ”的 选项 ， 在 打开 的 
“限制 对 页 的 访问 ”对 话 框 中 单 击 选择 “用 户 名 的 密码 ” 单 选 按钮 ， 在 “如 果 访 问 被 拒绝 ， 则 转 
到 ”文本 杠 中 输入 jforumy/forum.asp， 表 示 如 果 访 问 补 拒绝 则 转 到 该 页 面 ， 如 图 7-98 所 示 。 
































C 〇 ) 用 户 各、 密码 和 访问 级 别 





选取 级别 :| 


如 果 访 问 被 拒绝 ， 则 转 到 |: / forumy forum. asp | 











图 7-98 限制 对 页 的 访问 








单 击 “确定 ” 投 钮 ，admin.asp 负面 束 完成 设计 了 ， 完 成 后 的 效 来 如 图 7-99 所 示 。 
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7-99 完成 的 admin.asp 的 设计 效果 


月 删除 讨论 主题 页 面 | 


删除 讨论 主题 页 面 deltitle.asp 的 功能 不 只 是 删除 所 指定 的 回复 的 主题 ， 还 要 将 与 此 主题 
相关 的 回复 留言 从 数据 表 bbsref 中 删除 。 删 除 讨论 主题 页 面 设计 如 图 7-100 所 示 。 
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图 7-100 删除 讨论 主题 页 面 设计 





详细 步骤 如 下 : 

创建 删除 主题 页 面 deltitle.asp 的 毅 态 效 末 ， 然 后 单 击 “ 绑 定 ” 和 面板 中 的 加 扎 
“十 ”按钮 ， 在 弹出 的 荣 音 中， 选择 “记录 集 〈 和 三 询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 单 击 “高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 页 面 ， 将 现 
有 的 SQL 语句 改 成 以 下 的 SQL 语句 ， 如 图 7-101 所 示 。 

01. SELECT bbsmain.*,bbsref.*FROM 

02. bbsmam LEFT OUTER JOIN bbsref ON 

03. bbsmain.bbsID=bbsref.bbsmainID 

04. WHERE 

05. bbsmam.bbsID = queryID 
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添加 到 SaL: 
SELECT 
DRDER BY 


























图 7-101 改写 SQL 语句 
说 明 : 
上 图 中 设置 了 一 个 名 为 queryID 的 变量 值 ， 并 且 将 其 设 为 request.querystring(‘“bbsID””), 
传递 过 来 的 参数 。 
设 定 完 上 面 的 记录 集 绑 定 后 ， 还 需要 把 记录 集 deltitle.asp 中 的 字段 插入 到 网 页 
中 ， 如 图 7-102 所 示 。 
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图 7-102 deltitle.asp 中 的 字段 插入 


完成 页 面 的 字段 布置 后 ， 要 在 deltitle.asp 页 面 中 加 入 “删除 记录 ”命令 。 单 击 
“服务 器 行为 ”面板 中 的 加 号 “十 ”按钮 。 在 弹出 的 来 单 中 ， 选 择 “ 删 除 记 录 ” 选 项 ， 打 开 
“删除 记录 ”对 话 框 中 ， 按 照 下 面 的 参数 进行 设置 : 

@ 从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 

@ 从 “从 表格 中 删除 ”下 拉 沫 单 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsmain。 

@ 从 “选取 记录 目 ” 下 拉 列 表 中 ， 选 择 detail 记录 集 。 

@ 从 “唯一 键 列 ”下 拉 列 表 中 选择 bbsID 字段 ， 并 单 击 选择 “数值 ” 复 选 杠 。 

@ 在 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 forml 表 単 。 

@ 在 “删除 后 ， 转 到 ”文本 框 中 输入 删除 后 转 到 的 页 面 为 /forumy/forum.asp。 

设置 的 对 话 框 如 图 7-103 所 示 。 


























论坛 系统 





连接 ; 国 上 定义 ... 

从 表格 中 册 除 : bbsmain 
选取 记录 自 ; | detail 
唯一 键 列 : bbsID 


提 变 此 表单 以 删除 : forml 。 
册 除 后 ， 转 到 : /forumi forum. asp 























7-103 ”加 入 删除 记录 行为 


单 击 “ 确 定 ” 按 钮 ， 完 成 删除 讨论 主题 的 设置 ， 效 束 如 图 7-104 所 示 。 
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7-104 ”完成 的 设计 效果 


元 修改 讨论 主题 页 面 





修改 讨论 主题 页 面 adtitle.asp 使 用 “更 新 记录 ”行为 实现 bbsmain 数 据 表 中 数 据 的 更新 


修改 ， 页 面 的 静态 部 分 设计 如 图 7-105 所 示 。 
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图 7-105 修改 讨论 主题 页 面 设计 
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操作 步骤 如 下 : 

创建 adtitle.asp 网 页 的 静态 部 分 ， 单 击 “ 绑 定 ” 面 板 中 的 “+” 号 按钮 ， 在 弹 
出 的 菜单 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 。 

打开 “记录 集 ” 对 话 框 ， 单 击 “ 高 级 ”按钮 ， 进 入 记录 集 高 级 设 定 页 面 ， 将 现 
有 的 SQL 语句 改 成 以 下 的 SQL 语句 ， 如 图 7-106 所 示 。 


01. 
02. 
03. 
04. 
05. 


























基 |[ 定义 .| 








: SELECT 中 


sre 
FROM bbsmain OUR mm bbsr ef ON 
bbsmain bhs ID= bbsref. bbsm 
WHERE bbsmain.bbsID = quer be 








名 称 : queryID 

N/A 
equest. querystring ("bbsI. . 

默 


认 信 :1 
| 编辑 .| 

















添加 到 SQL: 


SELECT 


WHERE 


URIER BY 




















本 类 ”预存 过 程 








图 7-106 改写 SQL 语句 


SELECT bbsmain.*,bbsref.*FROM 
bbsmain LEFT OUTER JOIN bbsref ON 
bbsmain.bbsID=bbsref.bbsmainID 
WHERE 

bbsmain.bbsID = queryID 


上 图 中 设置 了 一 个 名 为 queryID 的 变量 值 ， 并 日 将 其 设 为 request.querystring(“bbsID”), 
传递 过 来 的 参数 。 
设 定 完 上 面 记 录 集 绑 定 后 ， 需 要 把 记录 集中 的 字段 插入 到 页 面 上 ， 如 图 7-107 


所 示 。 
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图 7-107 adtitle.asp 中 的 字段 插入 











完成 页 面 的 字段 布置 后 ， 要 在 adtitle.asp 页 面 中 加 入 “更 新 记录 ”的 设 定 。 
执行 灯 单 柱 中 的 “窗口 ”一 “服务 器 行为 ”命令 ， 打 开 “ 服 务 占 行为 ”面板 。 单 击 该 面板 
中 的 加 号 “+” 授 钮 ， 从 打开 的 弛 单 中 选择 “更 新 记录 ”命令 ,打开 “更 新 记录 ”对 话 
框 ， 按 图 7-108 所 示 进 行 设置 。 OO) 








连接 : 
要 更 新 的 表格 : | bbsmain 
选 职 记录 自 : | dstsi1 
唯一 键 列 : | bbsID 
在 更 新 后 ， 转 到 : forum/forum. asp 中 



































获取 值 自 : | forml 
表单 元 未: EE 灶神 Rd 吉 | “bbstitle” 

















列 : |bbstitle v| 


提 变 为 : | 文本 v 














图 7-108 加 入 更 新 记录 的 行为 


单 击 “ 确 定 ” 按 钮 ， 完 成 修改 主题 负面 的 制作 ， 此 时 的 效果 如 图 7-109 所 示 。 


し ch smem Vsdtitls, urr -证 MT] = 回避 


| EL enterum, tp trlt. cis 





赤井 FF . 衣 
し 和 = ds” # 
a -所 


环 请 文化 艺术 六 TT 守 太 六 于 Tp 


A 


wrt YivWtems [wh ェ E71T 和 漳 体 中 二 WEE3183 


图 7-109 修改 页 面 的 完成 效果 


7 删除 回复 主题 页 面 | 


最 后 ， 我 们 来 设计 删除 回复 主题 的 两 个 页 耐 delerf.asp 和 delrefcontent.asp， 其 功能 是 
将 表单 中 的 数据 从 网 站 的 数据 表 bbsref 中 删除 。delrefasp 页 面 设计 和 detail.asp 相似 , 不 
同 之 处 就 是 delrefasp 在 显示 回复 内 容 栏 后 面 多 了 一 个 删除 回复 的 详细 链接 ， 其 页 面 设计 如 
7-110 所 示 。 
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悩 n:tchap0Ttforumtdelref.asp (KHTML) 


[ 泥 羽 码 】 dsnforum. asp style. css マ 
> ! 2 = pe | 問 葬 理 図 
| sg < 。 ' 了 了 は ノ ; : 和 i : 


发 表 人 : {detail. bbsname}: 
主题 内 容 ・ {detail. bbscontent} 








・ {detail. bbsrefname} 





区 taetail bbstime} 顺 电子 邮件 ⑳ 主 


图 加 | 国 | 
body> く diy 幸 top> N |9 100% v949 x 526v 207 /5 秒 简体 中 站 (6B2312) 








7-110 delrefasp 页 面 的 设计 


具体 操作 步骤 如 下 : 

delref.asp 页 面 设计 和 主题 内 容 页 面 detail.asp 相似 ， 这 里 只 重 扣 介绍“ 删除 回 
复 ” 的 动态 设置 。 

单 击 选择 文字 “删除 回复 ”， 然 后 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ” 
标签 中 的 加 号 “十 ” 投 钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 。 

打开 “ 转 到 详细 页 面 ” 对 话 框 ， 评 细 设 置 如 图 7-111 所 示 。 








等到 语 细 页面 


链接 : | 所 选 范 围 : “删除 回复 “ 
说 组 信息 页 
人間 URL 参数 设置 为 以 下 项 的 和 


mm 
传递 现 有 参数 : | ] um 参数 
| | 表单 参数 





7-111 设置 转 到 详细 页 而 


单 击 “ 确 定 ” 按 钮 ， 完 成 转 到 详细 页 面 的 设置 。 

创建 delrefcontent.asp， 设 计 如 图 7-112 所 示 。 

单 击 “ 绑 定 ”面板 中 的 加 号 “十 ”按钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 记 录 集 ( 査 
询 )” 选 项 。 
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了 痪 文代 区 玉 本 网 动态 | 关于 我 们 小 广 堂 服务 | 设 为 首页 _| 去 情 链接 | 作证 招聘 
EAS CE ER Capyright aa 2000-20085 环 博 妆 化 艺术 EL _ Rights Reserwed. 
联系 电话 : 010=123456| 苇 真 :010-654321 
$j| | > 
<body> <div#bottom? く diy#copyright>Kimg [w|9 lo0% 、|949 x 526v| 192K/4 秘 簡体 中 文 (GB2312)  :: 


7-112 页 面 delrefcontent.asp 的 设计 





打开 “记录 集 ” 对 话 框 ， 按 如 下 参数 进行 设置 ， 单 击 “ 确 定 ” 按 钮 完成 议定 ， 
如 图 7-113 所 示 。 
在 “名 称 ” 文 本 框 中 输入 Recordsetl 作为 该 记录 集 的 名 称 。 
从 “连接 ”下 拉 列 表 中 选择 dsnforum 数据 源 连 接 对 象 。 
从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsref。 
在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 
设置 “ 科 选 ”的 条 件 为 “bbsrefID= URL 参 数 / bbsrefID”。 
设置 “排序 ”条 件 为 “无 ” 











表格 


列 : で ) 全 部 。 局 选 定 的 : 











7-113” 绑 定 记 录 集 设 定 





绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 网 页 的 适当 位 置 ， 并 加 入 一 个 隐藏 字 
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or 
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段 bbsrefItD， 设 置 如 图 7-114 所 示 。 


域 : 日 還 记录 集 (Eecordsetl】 本 
“bbsmainID 
bbsretname 
bbstime 
bbsrefcont ent 
bbsreftsex 
bhbsreturl 
bhsretmail 
[第 一 个 记录 索 5|] 


「- 上 月 广 一 -个 -3 才 寻 去 口 11 


テ 





发 码 : | 9 [Recordsetl. Fields. Tien ("bbsri 








BE 
I 隐 立 区 域 
上 QO [3 Racordsetl ia Tue Ubbsr| 2 


图 7-114 绑 定 隐藏 区 域 


完成 页 面 的 字段 布置 后 ， 要 在 delrefcontent.asp 页 面 中 加 入 “删除 记录 ”的 设 
定 。 早 击 “ 服 务 右 行为 ”面板 中 的 加 号 “十 ”按钮 。 在 弹出 的 且 单 中 ， 选 择 “ 有 删除 记录 ” 选 
项 ， 打 开 “ 删 除 记录 ”对 话 框 中 ， 按 照 下 和 面 的 参数 进行 设置 : 

@ 从 “连接 ”下 拉 末 蛙 中 选择 dsnforum 数 据 源 逢 接 対象 。 

@ 从 “从 表格 中 删除 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 bbsref。 

@ 从 “选取 记录 日 ”下 拉 列 表 中 ， 选 择 Recordsetl 记录 集 。 

@ 从 “唯一 键 列 ” 下 拉 菜 单 中 选择 bbsrefID 字段 ， 并 单 击 选择 “数值 ” 复 选 框 。 

@ 在 “提交 此 表单 以 删除 ”下 拉 列 表 中 选择 form1 表单 。 

@ 在 “删除 后 ， 转 到 ”文本 框 中 输入 删除 后 转 到 的 页 面 为 /forum/admin.asp。 

如 图 7-115 所 示 。 





























な 
从 表格 中 删除 : bbsref 
选 职 记 录 自 : 


唯一 键 列 : |bbsrefID 
提交 此 表单 以 删除 : fornl 
册 隆 后 ， 转 到 : VEorumyradnmin as 





























图 7-11$ 加 入 “删除 记录 ”行为 








单 击 “确定 ”按钮 ， 完 成 删除 回复 内 容 的 设置 ， 效 末 如 网 7-116 所 示 。 
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7-116 完成 删除 回复 后 的 页 面 效果 
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博客 (Blog) 是 WebBlog 的 缩写 ， 人 和 


单 来 说 就 是 网 络 日 记 。 一 个 博客 系统 可 以 - 
认为 是 一 个 独立 的 个 人 网 站 ， 它 通常 是 由 -Wn 
简短 而 且 经 常 更 新 的 日 记 所 构成 ， 这 些 文 二 ”过 
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本 章 的 实例 效果 
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博客 系统 开发 平台 に 

博客 系统 规划 の 
博客 系统 前 台 设计 に 
博客 系统 后 台 设计 に 








_Sectlon_ 


让 和 博客 系统 开发 平台 








本 章 使 用 ASP+Access 为 开 及 平台 开发 一 个 个 人 博客 系统 ， 该 系统 功能 比较 齐全 ， 用 户 
在 注册 后 可 以 及 布 个 人 日 记 ， 登 录 后 合 可 进行 目 我 管理 。 开 发 这 个 博客 系统 首先 需要 在 本 地 
搭建 博客 系统 的 开发 平台 ， 并 建立 静态 页 面 。 


骨 朋 月 使用 Photoshop CS5 分 割 图 片 








首先 使 用 Photoshop CSS 切片 工具 分 割 首 页 图 片 。 

首先 在 本 地 计算 机 的 D 盘 中 建立 站 点 文件 夹 chap08， 在 站 点 文件 夹 里 面 建立 
一 些 第 用 文件 来。 然后 从 光 检 中 找到 站 点 chap08/psd 文件 夹 中 的 index.psd 文件 ， 将 其 复制 
到 本 地 站 点 psd 文件 夹 中 。 

局 动 Photoshop CS5， 选 择 末 蛙 栏 中 的 “文件 ”一 “打开 ”命令 ， 打 开 目 页 
index.psd 文件 ， 可 分 制 的 效果 如 图 8-1 所 示 。 
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图 8-1 设计 的 首页 可 分 割 效果 

井 始 分 割 各 部 分 圏 語 , 育 先 分 割 最 上 面 的 Logo 所 在 行 的 图 片 ， 单 击 工具 箱 中 
的 “切片 工具 ”按钮 入， 按 住 鼠 标 左 键 从 场景 的 左上 角 拖 忠 到 标题 的 右 下 角 ， 如 图 8-2 所 
示 ， 图 中 虚线 框 绘制 的 就 是 切片 大 小 ， 切 片 后 左上 角 将 显示 一 个 园 国 图 标 。 


中 











临 ゴ 博 4 岁月 的 轮回 。 永 恒 的 记忆 |! 


8-2 Logo 部 分 的 切片 效果 

















按 下 快捷 键 (CtrIHH〉 组 合 键 ， 打 开 辅 助 线 视图 ， 可 以 先 用 辅助 线 分 割 好 需要 
分 割 的 区 域 ， 再 按照 辅助 线 分 割 。 本 例 将 整个 网 页 分 割 成 15 个 小 图 片 ， 如 图 8-3 所 示 。 
ED | 
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8-3 切片 整个 首页 的 效果 
选择 菜单 栏 中 的 “文件 ”一 “存储 为 Web 和 设备 所 用 格式 ”命令 ， 打 开 “ 存 
储 为 Web 和 设备 所 用 格式 ”对 话 框 ， 设 置 为 “GIF” 格 式 ,“ 颜 色 ” 值 为 236,“ 扩 散 ” 模 式 ， 
“ 仿 色 ” 值 为 100%, “Web 靠 色 ” 值 设置 为 100%， 其 他 设置 如 图 8-4 所 示 。 


有 上 赎 为 Web 和 和 说 各 有 启用 入 区 





OX 一 下 六 一 三 Device Centr si 


8-4 “存储 为 Web 和 设备 所 用 格式 ”对 话 框 


单 击 “存储 ”按钮 ， 打 开 “ 将 优化 结果 存储 为 ”对 话 框 ， 单 击 “保存 在 ”后 面 的 
下 拉 三 角 按 钮 总 ， 选 择 建立 的 chap08 文件 夹 ， 其 他 保持 默认 值 ， 设 置 如 图 8-5 所 示 。 
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将 优化 结果 存储 为 


保存 在 O: spoe 半生 








我 最 近 的 文档 
四 
中 
我 的 文档 


我 的 电脑 


~ 








岡上 部 居 








立件 名 @) : index 保存 名) 


保存 美 型 C): mmL 和 图 像 w.htm1) 取消 














设置 : 默认 设置 
切片 : 所 有 切片 




















8-5 “将 优化 结果 存储 为 ”对 话 框 设置 


区 ED 单 击 “ 保 存 ” 按 钮 ， 完 成 保存 切片 的 操作 。 打 开 保存 文件 的 路 径 ， 可 以 看 到 自 
动 生成 了 一 个 名 为 images 的 文件 来 ， 文 件 夹 里 是 前 面 切 片 后 产生 的 小 图 片 ， 由 这 些小 图 片 








组 成 了 首页 的 效 末 ， 在 设计 的 时 候 可 以 分 别 调用 这 些小 图 片 ， 如 图 8-6 所 示 。 
ーー 


: 文件 ) ”编辑 代 ) 查看 名 ”收藏 入 ) 工具 て ) 帮助 而) 
Om OO - SS De Ba 国 - 


: 地 玉 nchap08 い mages 














辆 从 反 措 仪 或 照相 机 获 
舰 图 片 

人 作为 幻灯 片 查 看 

全 联机 订购 照片 

吊 打印 图 片 


文件 和 文件 夹 芷 务 


四 1 和 娃 一 个 新 文件 夹 
(| 将 这 个 文件 夹 发 布 到 


sy 共享 此 文件 来 





图 8-6 切片 的 小 图 片 


下 配置 博客 系统 站 点 服 和 器 


使用 IIS 在 本 地 计算 机 上 构建 用 户 管理 系统 网 站 的 站 点 。 





配置 的 步骤 如 下 : 
首先 启动 IS, 在 IS 窗口 中 ， 右 键 单 击 “默认 网 站 ”选择 菜单 中 的 “属性 ” 














博客 系统 





命令 ， 打 开 “ 默 认 网 站 属性 ”对 话 框 ， 如 图 8-7 所 示 。 





网 站 标识 
描述 (8): 

IF 地 填 エ ): 
TCF 端口 J): 

















连接 
连接 超时 他) : 
尽 | 保持 ITTF 连接 @) 





回 自用 日 志 记 录 @) 
活动 日 志 格式 ①: 
[Wac 扩展 日 志文 件 格式 司 [属性 加. 














图 8-7 “ 雪 认 网 站 属性 ”对 话 框 


单 击 “ 主 目录 ”选项 卡 ， 在 “本 地 路 径 ” 文 本 框 中 输入 站 点 文件 夹 路 径 为 
“Di\chap08”， 其 他 保持 默认 值 ， 设 置 如 图 8-8 所 示 。 








网 站 ”ISAPI 第 选 器 | 主 目录 | 文档 “| 目录 安全 性 | HTTP 头 | 自 定义 错误 | 
人 








O 另 一 台 台 计算 机 上 的 共享 8) 
〇 重 定向 到 VRL⑪) 


本 地 路 径 (C): D: Acehap08 | 
中 脚本 资源 访问 民 ) 六] 记录 访问 WY) 
1 図 素 引 盗 源 エ ) 








口 目录 浏览 G) 
应 用 程序 设置 


应 用 程序 名 W): 默认 应 用 程序 册 除 ) 

开始 位 置 : < 铀 让 网 站 > 
| 配置 (@)...， | 

执行 椒 限 是 ): 纯 脚 本 EE. 


应 用 程序 保护 外 : 中 (共用 ) v 
































8-8 设置 网 站 的 “本 地 路 径 


单 击 “确定 ”按钮 ， 完 成 “默认 网 站 属性 ”的 配置 ， 由 于 前 面 已 经 使 用 
Photoshop CSS 分 割 了 页 面 ， 并 目 动 保存 生成 了 index.html 页 面 ， 所 以 打开 正 浏览 右 输 入 地 
址 http://127.0.0.1， 即 可 打开 页 面 切片 后 的 效 来 。 











使用 Dreamweaver CS5 进行 网 页 布局 设计 ， 首 先 需 要 用 定义 站 点 问 导 定义 站 点 ， 操 作 步 


骤 如 下 : 
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打开 Dreamweaver CS5， 选 择 末 单 栏 中 的 “站 点 ”一 “ 写 理 站 点 ”命令 ， 打 开 
“管理 站 点 ”对 话 框 。 

单 击 右边 的 “新 建 ” 投 钮 ， 从 弹出 的 下 拉 沫 单 中 选择 “站 点 ”命令 ， 则 打开 
“站 点 设置 对 象 ” 对 话 框 ， 进 行 如 下 参数 设置 : 

“站 点 名 称 ” chap08。 

“本 地 站 点 文件 夹 ” D:\chap08\。 

如 图 8-9 所 示 。 


靖 点 设置 对 锚 chap08 





Dreamweaver 站 点 是 网 站 中 使 用 的 所 有 文件 和 资源 的 集合 。 Drearmweaver 
站 点 通常 包含 两 个 部 分 ; 可 在 其 中 存储 和 处 理 文件 的 计算 机 上 的 本 地 文件 
夹 ， 以 及 可 在 其 中 将 相同 文件 发 布 和 到 web 上 的 服务 器 上 的 远程 文件 夹 。 


您 可 以 在 此 处 当 Dreamweaver 站 点 选择 本 地 文件 夹 和 名 称 。 
站 点 名 称 ; 
本 地 站 点 文件 夹 ; 二 





图 8-9 设置 站 点 对 话 框 


单 击 “ 分 类 ”列表 框 中 的 “服务 器 ”选项 ， 进 行 如 下 参数 设置 。 

“服务 器 名 称 ” chap08。 

“连接 方法 ” 本 地 /网 络 。 

“服务 器 文件 夹 ”，D:chap08。 

“Web URL”: http://127.0.0.1。 

单 击 “ 确 定 ” 按 钮 ， 完 成 站 点 的 定义 设置 。 在 Dreamweaver CSS 中 就 已 经 拥有 
了 刚才 所 设置 的 站 点 。 

div 页 面 布 局 由 于 篇 幅 关 系 这 里 束 不 做 具体 的 介绍 ， 读 者 可 以 打开 光盘 源 代 码 进行 





_Section 





博客 系统 规划 


博客 系统 的 主要 结构 分 成 一 般 用 户 使 用 和 管理 员 使 用 两 个 部 分 ， 个 人 博客 系统 的 页 面 共 
由 20 个 页 面 组 成 ， 包 括 博 客 主页 面 、 博 客 分 闫 页面、 个 人 博客 主页 面 、 日 记分 类 页 面 和 后 
台 管 理 页 面 。 























让 ;二 请 也 博 客 系 统 











博客 系统 的 页 面 设计 


每 一 个 注册 用 户 都 有 修改 、 删 除 目 己 日 记 的 功能 ， 系 统 页 面 的 功能 与 文件 名 称 见 表 8-1。 














表 8-1 博客 系统 将 要 开发 的 网 页 功能 








开发 的 页 面 页 面 名 称 功能 

博客 系统 主页 面 显示 最 新 博客 最 新 注册 等 信息 页 面 

分 类 页 面 列 出 所 有 博客 分 类 的 大 体内 容 

日 记 内 容 页 面 博客 分 类 中 子 内 容 的 详细 页 面 

个 人 主页 面 个 人 博客 主要 页 面 

日 记分 类 内 容 页 面 个 人 日 记分 类 的 内 容 页 面 

用 户 注册 页 面 新 用 户 注册 页 面 

管理 登录 判断 页 面 判断 登录 用 户 再 分 别 转向 不 同 页 面 

后 台 管 理 主页 面 一 般 用 户 管理 页 面 / 管理 员 管 理 页 面 
日 记分 类 管理 页 面 个 人 日 记分 类 管理 页 面 ， 可 添加 日 记分 类 
修改 日 记分 类 页 面 admin log typeupd.asp 修改 日 记分 类 的 页 面 

删除 日 记分 类 页 面 删除 日 记分 类 的 页 面 

日 记 列 表 管理 主页 面 个 人 日 记 列表 管理 页 面 ， 可 添加 日 记 
修改 日 记 列 表 页 面 修改 个 人 日记 的 页 面 

删除 日 记 列表 页 面 删除 个 人 日 记 的 页 面 

博客 分 类 管理 页 面 admin blog type.asp 管理 员 对 博客 分 类 管理 页 面 ， 可 添加 分 类 
修改 博客 分 类 页 面 admin blog upd.asp 管理 员 对 博客 分 类 进行 修改 的 页 面 
删除 博客 分 类 页 面 管理 员 对 博客 分 类 进行 市 除 的 页 面 
博客 列表 管理 主页 面 管理 员 对 用 户 博客 进行 管理 的 页 面 
推荐 博客 管理 页 面 管理 员 对 用 户 博客 是 否 推 荐 的 管理 页 面 
删除 用 户 博客 页 面 管理 员 对 用 户 博客 进行 删除 的 页 面 


数据 库 设计 


博客 系统 的 数据 库 命 名 为 blog， 并 在 里 面 分 别 建立 用 户 信息 表 users、 博 客 分 类 表 
blog type、 日 记 信息 表 blog log、 日 记分 类 表 log type 以 及 日 记 回 复 表 log reply 作为 博客 系 
统 数据 查询 、 新 增 、 修 改 与 删除 等 后 端 支 持 。 对 于 需要 创建 的 用 户 信息 数据 表 users、 博 客 
分 类 表 blog type、 日 记 信 息 表 blog log、 日 记分 类 表 log type 和 日 记 回 复 表 log reply 的 字 
段 结构 设计 和 分 析 如 下 : 

用 所 信忠 数 据 表 users 主要 用 来 存储 注册 用 户 的 信息 ， 并 上 其 有 统计 日 记 数 和 回 
复数 的 字段 ， 设 计 的 字段 和 数据 表 如 图 8-10 所 示 。 






































4 


ED users 
了 字 反 名 个 


¥ user_iD 
typernsne 文本 
Uaer_Uaerrane 文 本 
user password 文本 
user_blog_namc 
uaecr_addtinc 
User nail 
uaer_port_rum + 
user reply_ris NF 
user_blog_sgood に い に コ 
user_blog_explain 备注 
user_level まそ 





图 8-10 


图 8-11 所 示 。 





图 8-11 
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-四 XX 
说 虽 < 
用 户 ID _ 
博客 分 类 名 
用 户 瘟 孚 有 
用 户 登录 密码 
用 户 博客 名 
注 志 时 间 
用 户 最 畏 
入 育 日 志 数 


共 育 回复 数 
是 否 是 癣 三 博客 , 0 不 推荐 , 1 挫 稼 
博客 说 明 


子 阴 性 性 


小 数 江 右边 旺 示 的 垢 数 ， 





创建 的 users 用 户 信息 数据 表 
博客 分 类 表 blog type 用 于 存放 博客 创建 的 分 类 名 称 ， 





设计 的 字段 和 数据 表 如 


说 明 


nH 


博客 从 此 1 
博 考 党 找 种 





享 役 各 入 最 长 可 到 本 个 本 乱 [生活 齐 格 1， 時 
F1 屋 可 查 轩 厅 基 二 入 者 乏 的 竹山 ， 


创建 成 的 博客 分 类 表 blog type 
日 记 信 息 表 blog log 主要 用 于 存放 用 户 编 号 的 日 记 内 容 ， 











其 中 设置 了 日 记 添 加 


时 间 和 及 布 时 间 两 个 了 字段， 设计 的 子 段 如 图 8-12 所 示 。 




















国 Be lsg 
皇 民 者 数据 此 型 
Whog_Th 目 动 裁 屿 
TT 幸 率 
lsg_slaga_ iD 動 字 
op_title 本 
lgE_ 看 过问 中 出 胃 二 目 期 /村 闻 
(1oB_reply_rim 十 
pubDates 日 期 , 计 闻 
pg mn 定 
车 吉 下岗 
| 李 和 去 小 に ニー | 
| 新 看 1 
| 喘 式 
万 时 
宣旨 | 到 1 无 种 敌 ] 
立 李 嘲弄 5 
8-12 





= 本 其 ] 
说 明 也 
目 记 了 園 


1 


机 起 吉 必 是 长 可 到 的 个 订 符 [得 晤 全 丁 }。 按 
Fl 壁 可 查看 有 基本 生 扣 全 的 要 的 。 











日 记 信息 表 blog log 











博客 系统 


日 记分 类 表 log type 用 于 储存 注册 用 户 创 建 的 日 记分 类 信息 ， 设 计 的 字段 如 图 
8-13 所 示 。 














国 log_type -中 x 
字段 名 称 | 数据 类 型 | 说 明 全 
Wlog_class_ID 自动 编号 日 记分 类 ID| 国 
user_username 文 本 从 属 用 户 
log_class_name 文 本 日 记分 类 各 
log_class_num 数 字 当前 分 类 日 记 数 
Es 
字段 虱 性 
长 整 型 
递增 
に 字段 说 明星 可 选 的 。 用 于 帮助 说 明 该 字段 ,而 
受 且 当 在 窗 体 上 选择 该 字段 时 ， 也 在 状态 栏 上 有 显 


示 该 说 明 。 按 F1 键 可 坦 看 有 关 该 说 明 的 帮 
助 。 














图 8-13 日 记分 类 表 log type 





日 记 回 复 表 log reply 用 于 储存 日 记 回 复数 据 的 数据 表 ， 里 面 主要 建立 回复 日 
记 所 需要 的 孚 段 如 “回复 标题 和 “回复 时 间 和 “回复 内 容 ” 等 ， 设 计 的 log reply 数据 表 如 
图 8-14 所 示 。 

















国 log_reply ーー i < 
字段 名 称 | 数据 类 型 说 明 一 
Br reply_ID 自动 编号 回复 ID 国 
_ |1og_ID 数字 日 记 ID 
reply_us er 文 本 宇 复 人 姓名 
reply_title 文 本 回复 标题 
reply_addtinme 日 期 7 时间 回复 时 间 
reply_content 备注 回复 内 容 
字段 层 性 
常规 倡 
字段 大 小 长 莹 型 
新 值 递 并 
格式 
标题 
索引 有 (无 重复 ) 
智能 标记 i 
和 字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 


F1 键 可 音 看 有 关 字段 名 称 的 帮助 。 

















图 8-14 ”日 记分 类 表 log reply 








所 有 的 数据 表 都 是 在 Access 2007 里 面 完 成 的 ， 这 里 不 再 做 具体 介绍 。 
2% 创建 数据 库 连 接 
具体 连接 步骤 如 下 : 


执行 “控制 面板 ”一 “管理 工具 ”一 “数据 源 (ODBC)” 一 “系统 DSN” 选 
项 卡 ， 打 开 “ODBC 数据 源 管 理 右 ”对 话 框 中 的 “系统 DSN” 选 项 下 ， 如 图 8-15 所 示 。 
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在 打开 的 “系统 DSN” 对 话 框 中 单 击 “ 添 加 (D)” 按 钮 ， 将 打开 “创建 新 数 
据 源 ”对 话 框 ， 在 “创建 狐 数 据 源 ”对 话 框 中 ， 选 择 “Driver do Microsoft Access (*.mdb)” 
选项 ， 如 图 8-16 所 示 。 


#0DBC 数据 源 管理 器 
用 户 DSH 系统 DSH | 文件 SM | 驱动 程序 | 跟踪 ”| 连接 池 | 关于 | 
系统 数据 源 (8): 选择 您 想 涯 其 安装 数据 源 的 驱动 程序 G)。 
有 
er do Microsoft Access [*.m 
o Microsoft dEase (*. dbf) 
o Microsoft Excel (*. xls) 
o 1crosoft Paradox Gr. db ) 


ase ] 
ase VFF Hriyer (*. dbf) 





图 8-15 ODBC 数据 源 管理 器 中 的 系统 DSN 图 8-16 创建 数据 源 


单 击 “完成 ”按钮 ， 打 开 “ODBC Microsoft Access 安装 ”对 话 框 ， 在 “数据 
源 名 (N)” 文 本 框 输入 blog， 单 击 “ 选 择 〈S)” 按 钮 ， 打 开 “ 选 择 数 据 库 ”对 话 枉 ， 单 击 
“驱动 器 (V):” 文 本 框 右 侧 的 下 拉 三 角 按 钮 二， 从 下 拉 列 表 中 找到 在 创建 数据 库 步 骤 中 数据 库 
所 在 的 盘 符 ， 在 “目录 (D) :” 中 找到 在 创建 数据 库 步 又 中 保存 数据 库 的 文件 夹 ， 然 后 单 击 
左上 方 “ 数 据 库 名 (A)” 选 项 组 中 的 数据 库 文 件 blogmdb, 員数 据 麻 名 称 目 効 添加 到 “数 
据 库 名 “A)” 下 的 文本 框 中 。 如 图 8-17 所 示 。 

单 击 “确定 ”按钮 ， 返 回 到 “ODBC 数据 源 管理 器 ”中 的 “系统 DSN” 选 项 
卡 中 。 在 这 里 看 到 “系统 数据 源 ” 中 ， 已 经 添加 了 了 “名称” 为 “blog”， “驱动 程序 ”为 
“Driver do Microsoft Access 〈(*.mdb )” 的 系统 数据 源 ， 如 图 8-18 所 示 。 























大 0DBC 数据 源 管 理 需 
用 户 nsm 系统 DSN| 文 件 DSH | 驱动 程序 | 跟踪 | 连接 池 | 关于 | 
系统 数据 源 (8): 


数据 库 名 必 ) 目录 ⑪): 
bloz. mab| d: ‘chapD3‘\mdb 


blog. mdb 


0DBC 系统 数据 源 存 情 了 如 何 与 指定 数据 提供 程序 
统 数 据 源 对 当前 机 强 上 的 所 有 用 尸 可 见 ， 


文件 美 型 て ): 


IAccess 数据 库 tm ママ | | d: 新 加 卷 ”| 





图 8-17 选择 数据 库 图 8-18 ODBC 数 据 源 管理 器 


单 击 “ 确 定 ” 投 钮 ， 完 成 “ODBC 数据 源 管 理 堪 ”中 “系统 DSN” 的 设置 。 
局 动 Dreamweaver CSS$， 设 置 好 “站 点 入 “文档 类 型 ”和 “测试 服务 器 ”后 ， 打 开创 建 的 
index.asp 网 页 。 

在 Dreamweaver CS5 软件 中 执行 荣 单 栏 中 的 “文件 ”一 “窗口 ”一 “数据 库 ” 
命令 ， 打 开 “ 数 据 库 ”面板 ， 单 击 “ 数 据 库 ” 面 板 中 的 “十 ”号 按钮 ， 在 下 拉 荣 单 中 选择 
“数据 源 名 称 (DSN)” 命 令 。 











博客 系统 





打开 “数据 源 名 称 (DSN)” 对 话 框 ， 在 “连接 名 称 : ”文本 框 中 输入 blog， 单 
击 “ 数 据 源 名 称 (DSN): ”文本 框 右 侧 的 下 拉 三 角 按 钮 总 ， 从 打开 的 下 拉 菜 单 中 选择 建立 的 
blog， 其 他 保持 默认 值 ， 如 图 8-19 所 示 。 


ES 6 ] > 


SE 
数据 源 名 称 SN): 























密码 : 
Dreamweaver 应 连接 : 〇 使 用 测试 服务 器 上 的 DSN 
〇 使用 本 地 nsW 











图 8-19 建立 数 据 源 名 称 





单 击 “ 确 定 ” 按 钮 ， 完 成 数据 库 的 连接 。 同 时 系统 将 在 网 站 根 目录 下 ， 自 动 创 
建 一 个 名 为 Connections 的 文件 夹 ， 而 且 Connections 文件 夹 内 包含 connblog.asp 数据 库 连 
接 文件 。 





二 一 EE * ル L ヽ 
博客 系统 前 台 设 计 
在 博客 系统 前 台 的 页 面 设 计 中 ， 首 页 index.asp 中 主要 由 博客 分 类 、 最 新 日 记 、 访 问 纪 
计 、 推 荐 博客 和 用 户 注册 等 几 大 栏目 组 成 。 用 户 登录 后 可 进入 个 人 博客 主页 面 和 个 人 博客 管 
理 页 面 ， 对 日 记 列 表 进行 修改 、 删 除 和 添加 操作 。 











8.3.1 


制作 博客 的 主页 面 index.asp， 博 客 系统 首页 index.asp 主要 由 博客 分 类 、 最 狐 日 记 、 文 














章 统计 、 推 荐 博客 和 用 户 登录 等 几 大 栏目 组 成 ， 其 页 面 设 计 效 果 如 图 8-20 所 示 。 


庫 圭 .L 画 証 = Mirrerat 











图 8-20” 主 页面 效果 图 
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制作 的 步骤 如 下 : 
启动 Dreamweaver CS$, 投 照 較 8-20 所 示 的 效果 图 在 Dreamweaver CSS 中 设 
计 毅 态 部 分 页 面 效 果 如 图 8-21 所 示 。 
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8-21 净 态 页 面 设计 图 


首先 设计 “用 户 登 录 ” 栏 目的 用 户 登 录 功 能 ， 单 击 鼠 标 选 择 <form1> 表 单 ， 执 
行 荣 单 栏 中 的 “窗口 ”一 “服务 器 行为 ”命令 ， 打 开 “ 服 务 器 行为 ”面板 。 单 击 该 面板 中 
“+” 号 按钮 ， 从 打开 的 菜单 中 选择 “用 户 身 份 验 证 ”一 “登录 用 户 ” 命 令 ， 打 开 如 图 8-22 
所 示 的 “登录 有 用户” 对话 框 ， 有 具体 参数 设置 如 下 : 
@ 从 “从 表单 获取 输入 ”下 拉 列 表 中 选择 该 服务 器 行为 使 用 网 页 中 的 form1 表单 对 象 中 
浏览 者 填写 的 对 象 。 
@ 从 “用 户 名 字段 ”下 拉 列 表 中 选择 文本 域 user name 对象， 设 定 该 用 户 登 录 服 务 咒 行 
为 的 用 户 名 数据 来 源 为 表单 的 user name 文本 域 中 浏览 者 输入 的 内 容 。 
© “密码 字段 ”下 拉 列 表 中 选择 文本 域 user password 对 象 ， 设 定 该 用 户 登录 服务 器 
行为 的 用 户 名 数据 来 源 为 表单 的 user password 文本 域 中 浏览 者 输入 的 内 容 。 
@ “使 用 连接 验证 ”下 拉 列 表 中 选择 用 户 登 录 服 务 器 行为 使 用 的 数据 源 连 接 对 象 为 
connblog。 
@ 从 “表格 ”下 拉 列 表 中 选择 该 用 户 登 录 服 务 器 行为 使 用 到 的 数据 库 表 对 象 为 users。 
@ 从 “用 户 名 列 ” 下 拉 列 表 中 选择 表 users 存储 用 户 名 的 字段 为 user username 字段 。 
@ 从 “密码 列 ” 下 拉 列 表 中 选择 表 users 存储 用 户 密码 的 字段 为 user password 字段。 
@ 在 “如 果 登 录 成 功 ， 转 到 ”文本 框 中 输入 登录 成 功 后 ， 转 问 /check.asp 页 面 。 
@ 在 “如 果 登 录 失 败 ， 转 到 ”文本 框 中 输入 登录 失败 后 ， 转 问 /err.asp 页 面 。 
@ 选择 “ 莹 于 以 下 项 限制 万 问 ”后 面 的 “用 户 名 和 密码 ” 单 选 按钮 ， 设 定 后 将 根据 用 
户 的 用 户 名 、 密 人 码 决 定 其 浏览 网 页 的 权限 。 
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从 表单 获取 输入 : 
用 户 名 字段 : us er_UsSername 


密码 字段 : us er_password 





使 用 连接 验证 : connbloe 
表格 : users 
用 户 名 列 : user_username 
密码 列 : [user_password 
如 果 营 录 成 功 ， 转 到 : /check asp 


し | 转 到 前 一 个 URL(C 如 果 它 存在 ) 
如 果 登 录 失 败 ， 转 到 |: |/ err. asp 








基于 以 下 项 限制 访问 : (や ”用 户 名 和 密码 
〇 用 户 名 、 密 码 和 访问 级 别 
获取 级 别 自 : 











图 8-22 ”设置 “登录 用 户 ”对 话 杠 


“博客 用 户 ” 栏 其 实 束 是 显示 users 数据 表 中 的 最 新 记录 ， 单 击 “ 绑 定 ” 面 板 
中 的 加 号 “+” 按 钮 ， 在 弹出 的 采 早 中， 选择“ 记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 
框 ， 按 如 下 参数 进行 设置 ， 如 图 8-23 所 示 。 

@ 在 “名 称 ” 文 本 框 中 输入 Rsl 作为 该 记录 集 的 名 称 。 

@ 从 “连接 ”下 拉 列 表 中 选择 connblog 数据 源 连 接 对 象 。 

@ 从 “表格 ”下 拉 列 表 中 ， 选 择 使 用 的 数据 库 表 对 象 为 users。 

@ 在 “ 列 ” 选 项 组 中 选择 “全 部 ” 单 选 按钮 。 

@ 设置 “ 饶 选 ”的 条 件 为 “无 ” 

@ 在 “排序 ”下 拉 列 表 中 选择 user ID 选项 ， 然 后 选择 “降序 ”的 排列 顺序 。 



































1 
: | E BL E 


:| usSers 


「 で ) 全部 いし 选 定 的 
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图 8-23 绑 定 Rs1 记录 集 


绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 全 index.asp 网 页 的 适当 位 置 ， 如 图 
8-24 所 示 。 








アオ Dreannweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 








加 入 “服务 器 行为 ”中 的 “重复 区 域 ”的 设 定 ， 单 击 要 重复 显示 的 行 ， 如 图 
8-25 所 示 。 





違 客 用 戸 : 


1 
Rs1 user_usernamel iRs1. user 1sername} 
I 


图 8-24 插入 至 index.asp 网 页 中 图 8-25 ”选择 要 重复 的 行 
单 击 “ 应 用 程序 ” 群 组 面板 中 的 “服务 器 行为 ”标签 ， 并 单 击 面板 中 的 加 号 


“+ ”按钮 。 在 弹出 的 沫 单列 表 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 
显示 的 记录 数 为 5， 如 图 8-26 所 示 。 

















图 8-26 选择 一 次 可 以 显示 的 记录 数 





单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 先前 所 选取 要 重复 的 区 域 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

显示 出 最 新 注册 的 用 户 后 ， 访 客 可 以 单 击 用 户 名 进入 用 户 个 人 博客 页 面 ， 方 法 
是 首先 选取 编辑 页 面 中 的 Rsl.user username 字段 ， 如 图 8-27 所 示 。 

单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 上 的 加 号 “+” 按 钮 ; 在 弹出 
的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选项， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 按钮， 打开 “选择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 
为 user username， 如 图 8-28 所 示 。 























链接 : "<%= (Rsl. Fields. Item (“user_us' 鼠 
详细 信息 页 : user. asp| 
传递 URL 参数 :user_username 设置 当 以 下 项 的 值 
记录 集 : | Rsl 


眶 窜 用 户 列 : | user_username 


传递 现 有 参数 : | ] um 参数 


[| 表单 参数 





re 1 
IEsl. user usernamei 





图 8-27 选择 字段 图 8-28 设置 “ 转 到 评 细 页 面 ” 


单 击 “确定 ”按钮 ， 完 成 对 “最 新 注册 ”栏目 的 制作 。 下 面 将 对 统计 栏目 进行 
设计 ， 需 要 进行 统计 的 栏目 包括 博客 数 、 日 记 数 和 回复 数 ， 可 以 在 记录 集 查 询 高 级 模式 中 的 
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SQL 语句 中 使 用 count(*) 函 数 进行 统计 。COUNT(*) 函数 不 需要 expression 参数 ， 因 为 该 函 
数 不 使 用 有 关 任何 特定 列 的 信息 。 该 函数 计算 符合 查询 限制 条 件 的 总 数 。COUNT(*) 函数 返 
回 符合 查询 中 指定 的 搜索 条 件 的 数目 ， 而 不 消除 重复 值 。 | 

单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 上 的 加 号 “+” 按 饥 ， 在 打开 的 列表 菜 (②) 
单 中 选择 “记录 集 (查询 )” 选项， 打开 “记录 集 ” 对 话 框 ， 按 图 8-29 所 示 设置 相应 的 参数 。 


























=2| 
| 











: | onnb1og 








: SELECT count (*) as num 
FROM users 














由 表格 添加 到 SaL: 


及 ”视图 
田 糙 ”预存 过 程 -rr 


OFDER BY 








8-29” 绑 定 记录 和 集 Rs2 


SQL 语法 说 明 : 
SELECT count(*) as num 
FROM users 
/计算 所 有 用 户 博 客 数 
两 次 执行 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 上 的 加 号 “+” 按 钮 ， 在 打 
开 的 列表 六 蛙 中 选择 “记录 集 (会 询 )” 选 项 打开 “记录 集 ” 对 话 框 ， 在 打开 的 “记录 集 ” 
对 话 框 中 分 别 输入 如 图 8-30 和 图 8-31 所 示 的 参 数 。 




















=3| 


: | connblog 











: SELECT count (*) as mm 
FROM blog log 

















添加 到 SgL: 


SELECT 


WHERE 


URIER BY 





本 长 ”预存 过 程 





8-30 ” 绑 定 记录 集 Rs3 
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SQL 语法 说 明 : 

SELECT count(*) as num 
FROM blog log 
/计算 所 有 日 记 数 


名 称 : | 
连接 : cormblog 


SQL: SELECT count tk) as rm 
FROM log_reply 




















+ 表 格 添加 到 SQL: 


月 视图 [suecr  ) 


田 六 ”预存 过 程 ーー 


ORDER BY 














图 8-31 ” 绑 定 记录 和 集 Rs4 








SQL 语法 说 明 : 

SELECT count(*) as num ， : 博 宫 统计 

FROM log reply hi 
1/ 计算 所 有 回复 数 内 : ee 





绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 图 8-32 插入 全 index.asp 网 页 中 
全 index.asp 网 幢 的 适当 位 置 ， 如 图 8-32 所 示 。 

插入 学 段 后 对 “文革 统计 ”栏目 的 制作 已 完成 ， 现 在 来 设置 “推荐 博客 ”一 
栏 ， 推 荐 博客 的 条 件 应 为 users 数据 表 中 的 user blog good 等 于 “1”， 单 击 “ 应 用 程序 ” 面 
板 中 的 “ 绑 定 ”标签 上 的 加 号 “+” 投 钮 ， 在 打开 的 列表 沫 单 中 选择 “记录 集 〈 答 询 )” 选 项 
打开 “记录 集 ” 对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 中 输入 如 图 8-33 所 示 的 参 数 。 























名 称 : 3 
连接 : | conmb1og 
SQL: SELECT * 
FROM users 
WHERE user blog good=1 














添加 到 SgL: 


SELECT 


線 ”预存 过 各 


DRDER BY 

















图 8-33 ” 绑 定 记录 集 Rs6 
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SQL 语法 说 明 : 
SELECT * 
FROM users // 从 数据 库 中 选择 gbook 数据 表 
WHERE user blog good=1 // 选 择 的 条 件 为 user blog good 为 1 ST 
单 击 “确定 ”按钮 完成 对 Rs6 记录 集 的 绑 定 ， 然 后 将 Rs6 记录 集中 的 
user blog name 和 user username 两 个 字段 插入 到 页 面 的 适当 位 置 ， 如 图 8-34 所 示 。 DB、 











加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 行 ， 如 图 
8-35 所 示 。 
:推荐 铺 多 。 





J 二 一 ー = rs ーー 
RT ee '{RsB. user blog name} 
itRsB. user_blog name} < i 

IRsB. USer usernamel 


iTRsB. user_username} ' 
图 8-34 ”将 两 个 字段 段 插 入 到 页 面 中 图 8-35 ”选择 要 重复 的 行 
单 击 “应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 在 打开 “重复 区 域 ” 
对 话 框 中 设置 显示 的 记录 数 为 2， 如 图 8-36 所 示 。 








重复 区 域 





图 8-36 选择 一 次 可 以 显示 的 记录 数 











单 击 “ 人 确定 ”按钮 回 到 编辑 页 面 ， 将 发 现 之 击 选 中 要 重复 的 区 域 的 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

显示 出 推荐 用 户 的 博客 后 ， 用 户 可 以 单 击 博客 名 进入 用 户 个 人 的 博客 页 耐 ， 选 
中 编辑 页 面 中 的 Rs6.user blog name 字段 ， 如 图 8-37 所 示 。 

















IRsB. user bloe namel 





iTRsE. User usernamel 


图 8-37 ”选择 字段 


单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按钮 。 在 弹出 








ジン ター 
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的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 
为 user Username， 如 图 8-38 所 示 。 


链接 : | "< に (RsB.Fis1ds.Ttsm ("user_b1, v 
详细 信息 页 : user. ssp 


供 悦 URL 参 数 : user_username 设置 洲 以 下 项 的 值 
记录 集 : RsB 


列 | : USer USern e 
传递 现 有 戎 数 : [ ] umr 参数 
表单 参数 





图 8-38 ”设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 完成 对 “推荐 博客 ”栏目 的 制作 ， 在 “博客 分 类 ”栏目 中 主 
要 是 绑 定 blog type 数据 表 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 
在 打开 的 列表 菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 参 数 设 置 如 图 
8-39 所 示 。 

















名 称 : El 
连接 : | connblog 
表格 : blog_type 


列 : で) 全 部 〇 选 定 的 : 








图 8-39 ” 绑 定 记录 集 Rs7 
单 击 “确定 ”按钮 完成 对 Rs7 记录 集 的 绑 定 ， 将 Rs7 记录 集中 的 typename 字 
段 插 入 到 页 面 的 适当 位 置 ， 如 图 8-40 所 示 。 
在 显示 博客 分 类 的 记录 数 时 要 求 显 示 出 所 有 的 博客 分 类 数 ， 而 目前 的 设 定 只 能 
显示 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 
行 ， 如 图 8-41 所 示 。 























TEsT. tvpenamel 
图 8-41 选择 要 重复 的 行 








第 8 章 人 于 :元 








单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 

弹出 的 菜单 列表 中 ， 选 择 “重复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 在 打开 “重复 区 

域 ”对 话 框 中 设置 显示 的 记录 数 为 “所 有 记录 ” 如 图 8-42 所 示 ， ー 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 他 

了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 Te 
显示 所 有 博客 分 类 后 ， 为 了 实现 单 击 博客 中 的 分 类 能 够 进入 博客 分 类 的 子 内 容 

页 面 ， 需 要 选中 编辑 页 面 中 的 Rs7.typename 字段 ， 如 图 8-43 所 示 。 





























图 8-42 ”选择 一 次 可 以 显示 的 次 数 图 8-43 ”选择 字段 


选择 Rs7.typename 字段 后 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 
中 的 加 号 “+” 按 钮 ， 在 弹出 的 六 单列 表 中 选择 “ 转 到 详细 页 耐 ” 选 项 ， 在 打开 的 “ 转 到 详 
细 页 面 ” 对 话 框 中 单 击 “浏览 ”按钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 
blog type.asp， 将 “传递 URL 参数 ”设置 为 typename， 如 图 8-44 所 示 。 








链接 : “<%= (RsT. Fields. Item ("typenam | 
详细 信息 见 : |blog_type asp 
传递 URL 参数 : typename 设置 河 以 下 项 的 值 
记录 集 : |Rs7 wv | 


列 : | typename | 
传递 现 有 套数 : | ] mr 参 豚 
| ] 表单 参数 





图 8-44 设置“ 转 到 详细 页 面 ” 


单 击 “确定 ”按钮 则 完成 “博客 分 类 ”栏目 的 制作 ， 下 面 将 制作 “最 新 日 记 ” 
栏目 ， 最 新 日 记 用 到 的 是 日 记 信息 表 blog log， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 
的 加 号 “+” 按 钮 ， 在 打开 的 列表 菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 
框 ， 参 数 设 置 如 图 8-43 所 示 。 
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训 称 ”| 加 加 | 


和 连接: | ED 


靖 放 : 玩 v| 


排序 : |1og Tn | | 降序 ”| 





图 8-45” 绑 定 记 录 集 Rs5 


单 击 “ 确 定 ” 按 钮 则 完成 对 Rs5 记录 集 的 绑 定 ， 然 后 将 Rs5 记录 集中 的 字段 插 
入 到 页 面 的 适当 位 置 ， 如 图 8-46 所 示 。 

在 显示 最 新 日 记 的 记录 数 时 要 求 显示 部 分 日 记 ， 而 目前 的 设 定 只 能 显示 一 条 
记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 行 ， 如 
8-47 所 示 。 





























最 新 日 南 0 
{Rs5. EE 3 { Es5. ii ! iRs5. lug titlel Rs. user_ usernamel 
1Rs5. lag addtimel {Rs5. 1ng addtime} 
图 8-46 ”插入 字段 图 8-47 ”选择 要 重复 的 行 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 ， 并 在 面板 上 单 击 “+” 
号 按钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 打 
开 “ 重 复 区 域 ” 对 话 框 中 设置 显示 的 记录 数 为 5， 如 图 8-48 所 示 。 

单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 会 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

为 实现 单 击 最 新 日 记 的 标题 即 可 进入 日 记 详细 内 容 页 面 查看 内 容 ， 需 要 选中 编 
辑 页 面 中 的 Rs5.log title 字段 ， 如 图 8-49 所 示 。 



































Rs5.1ng titlel 





图 8-48 ”选择 一 次 可 以 显示 的 次 数 图 8-49 ”选择 字段 











博客 系统 


选择 Rs5.log_title 字段 后 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 
的 “+” 号 按钮 ， 在 弹出 的 染 单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 
面 ” 对 话 框 中 单 击 “浏览 ”按钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 
log_content.asp， 将 “传递 URL 参数 ”设置 为 log ID， 设置 如 图 8-30 所 示 。 

















链接 : “<%= (Rs5. Fields. Iten "log tit | 
详细 信息 页 : log_content.asp 


传递 UEL 参 数 : 1og_TI| ”设置 为 以 下 项 的 值 
记录 集 : [Rs5 司 
列 : log Tn | 
传递 现 有 参数 : | ] mm 参数 
し | 表单 参数 






































8-50 ”设置 “ 转 到 详细 页 面 ”对 话 框 





早 击 “确定 ”按钮 ， 则 完成 对 博客 主页 面 index.asp 的 设计 与 制作 ， 完 成 后 的 
整体 效果 如 图 8-51 所 示 。 


| 
TT 闻 


| 


:电量 十 字 .9 湯前 | 
Er も 
ORE 


肌 跨 日 更 _| 


| 22202 1 
貴士. Lag iitlel NEE. mear_ we | F : 








图 8-51 完成 的 设计 效果 


: ド 用 博客 分 类 页 面 


博客 分 类 页 面 blog type.asp 主要 用 于 显示 博客 分 关中 的 子 信息 页 面 ， 其 吏 态 设计 如 图 
8-52 所 示 。 
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admin blog_d. … 5EE ASF 立件 
admin_ blog g... TEE ASE 立件 ツ | 


关于 我 /新 闻 公 告 /我 的 好 友 / 晤 近 访 客 /最 新 评论 / 晤 新 留言 ee 


一 


Ell 


| 


< 山 | 
<body> <divimid> <div. content> <table> <tr> <td> |w | ぐ で GL T48 x 455y 2BTK ど BEB 秒 简体 中 总 (6B2312) 


8K 无 >| 类 无 >| BZ 生生 汪汪 AOL 
mes DE SO me 


单元 格 水平) 默认 ”vx| 宽 0) | 720| 不 换行 o) [] 背景 顔色 ⑤)「 | | 页 面 属性 ，. 
口 站 ”本 下 四) 黑人 vv 高 | | 标题 0 口 











| = 
ll| 世 





8-$2 blog type.asp 静态 页 面 效果 


人 制作 步骤 如 下 : 
创建 博客 分 闫 页面 blog _ type.asp， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ” 
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的 加 号 “+” 控 钮 ， 在 打开 的 列表 菜单 中 选择 “记录 集 〈 但 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 


框 ， 参 数 设 置 如 图 8-53 所 示 。 


| connb1og ”| 


3 | msers 


の 全部 し ) 选 定 的 : 


UsSer +L 











8-53 ” 绑 定 记录 集 Rs 








单 击 “确定 ”按钮 ， 则 完成 对 Rs 记录 集 的 绑 定 ， 将 Rs 记录 集中 的 字段 插入 到 


页 面 的 适当 位 置 ， 如 图 8-54 所 示 。 








图 8-54 插入 字段 


加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 行 的 ， 如 图 
8-55 所 示 。 
Rs user username} Rs. user blog namell{Rs. user_ email】 Rs mser addtimer HRs. user post rum} 
图 8-55 选择 要 重复 的 行 


单 击 “应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 显 示 的 记录 数 为 
1$， 如 图 8-56 所 示 。 























图 8-56 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

将 鼠标 移 至 要 加 入 “记录 集 导 航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 条 ”按钮 副 ， 在 打开 的 对 话 框 中 ， 选 中 要 导航 的 记录 集 以 及 导 
航 条 的 显示 方式 ， 单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 如 图 8-37 所 示 。 























图 8-57 插入 “记录 和 集 导航 条 ” 
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选中 编辑 页 面 中 的 Rs.user blog name 字段 ， 如 图 8-38 所 示 。 

单 击 “应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 
的 菜单 列表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 投 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 为 
User_Username， 设 置 如 网 8-59 所 示 。 





链接 : "<%= (Rs. Fields. Iten ("user_blo; ww | 
详细 信息 页 : nser. asp 


传递 URL 参 数 : user_usernane 设置 为 以 下 项 的 值 




















皇 寄 种 : 口 表单 参数 


Rs. user usernamel :{Rs. us er_blog name}: 





8-58 选择 字段 8-59 ”设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 选择 Rs.user_email 字段 在 “属性 ”面板 中 “链接 ”文本 框 后 面 的 “浏览 
文件 ”按钮 回 ， 打 开 “ 选 择 文件 ”对 话 框 ， 在 该 对 话 框 中 单 击 选 择 “数据 源 ” 单 选 按钮 ， 在 
“ 域 ” 列 表 框 中 单 击 选择 “记录 集 (Rs)” 中 的 user email 字段， 并且 在 URL 链接 表面 加 上 
mailto:， 如 图 8-60 所 示 。 

单 击 “确定 ” 按 钮 ， 则 完成 博客 分 类 页 面 blog type.asp 的 设计 与 制作 ， 效 末 如 
图 8-61 所 示 。 
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格式 : | 无 wv| 


URL: mailto: <¥%= (Rs. Fields. Item (“user_email"). | 
在 站 点 定义 中 更 改 点 认 的 链接 相对 于 

















确定 
し リィ アッー 
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8-60 ”设置 给 对 方 发 送 email 的 URL 链接 8-61 页面 blog type.asp 的 完成 效果 


天 并 前 日 记 内 容 J 面 " 。  )，) 


日 记 详 细 内 容 页 面 log_content.asp 除了 用 于 显示 日 记 的 详细 内 容 和 访客 留言 信息 外 ， 还 














应 为 访问 者 提供 一 个 留言 板 ， 日 记 内 容 负 面 的 设计 效果 如 图 8-62 所 示 。 
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关于 我 /新 闻 公告 /我 的 好 友 / 晤 近 访客 /最 新 评论 / 景 新 留言 GMR 


E-mail: jambola12B. com 






图 8-62 日 记 内 容 页 面 效果 


设计 步骤 如 下 : 

创建 日 记 详细 内 容 页 面 log contentasp， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ?” 
标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 亲 单 中 选择 “记录 集 (人 查询)” 选 项 ， 打 开 “ 记 录 
集 ” 对 话 框 ， 参 数 设置 如 图 8-63 所 示 。 

绑 定 记录 集 后 ， 将 记录 集 Rsl 中 的 字段 插入 全 log content.asp 网 页 的 适当 位 

如 图 8-64 所 示 。 
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- BA dieu 
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画質 1 


loz TI Pe 
0 . | 


UsSer userrmame 
log class _TIH 
loz を 


|- 


log addtime 
[a 





8-63 ” 绑 定 记录 集 Rs1 8-64 ”插入 Rsl 记录 集中 的 字段 


再 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ” 标 签 中 的 加 号 “+” 按钮 ， 在 打开 的 列 
表 荣 单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 和 集 ” 对 话 框 ， 具 体 参 数 设 置 如 图 8-6 所 
示 。 

绑 定 记录 集 后 ， 将 记录 集 Rs2 中 的 字段 插入 至 log content.asp 网 页 的 适当 位 

如 图 8-66 所 示 。 
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EF | 

same 
名 称 : 邢 FE fr mm 
和 连接: | connblog 


表格 :| log_reply 


列 : @ 全 部 〇 选 定 的 : 
reply ID 























reply title 
D] addtime 


筛选 : 1。g Tn MI = 


| URL 参数 ¥ | hog Tn 


























8-65 绑 定 记录 集 Rs2 8-66 插入 Rs2 记录 集中 的 字段 


加 入 “服务 此 行 为 ”中 “重复 区 域 ” 设 是 ， 蛙 击 log content.asp 页面 中 记录 的 
那个 表格 ， 如 图 8-67 所 示 。 
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8-67 选择 要 重复 的 表格 


单 击 “应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 中 ， 选 择 “重复 区 域 ” 选 项 ， 在 打开 “重复 区 域 ” 对 话 框 中 ， 设 置 显示 的 记录 数 
为 5， 如 图 8-68 所 示 。 











图 8-68 选择 显示 的 记录 数 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 











一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 ， 如 网 8-69 所 示 。 


sseeeweweseseseesesssesssssssssesesssssssssssssssesssssssssssssssssssesesssssssssssssssesssssssssssssssssssesssssssssssssssssssssssssssssssssssssssssssssssseeeese 
トト ささ ささき きさく くさ やき や や やき や や やや や や や や や や や きき や や や や や や や やや や や やき や や やや や や や や や や や や や や や や やや や や やや や や や や や や や や や や や や や や や や や や や や や や や や きき やや や やや や や やや や やや や や や や や や やや や や や やや や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や や やや や きく きく くき て 
トト ささ ささき きき や きき てき きき やや や や や きき やや や や や や やや や やや や や や や や や や や や やや や や や や や や や や や や や や や や や や や や や や や や や やや や や や や や やや や や や や や やや や や や や や や や や や や や やや や やや や や や や や や やや や や や や や や や や やや や や や や や やや や や や や や や や や や や や や や や や や や や や や や や や や や や やや や や や や や や や きき て 


て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て すす て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て て 1 











8-69 完成 次 定 “軍令 区 域 ” 


接 下 来 要 在 log content.asp 中 加 入 “记录 集 导航 条 ”， 以 便 分 页 显示 回复 的 数 
据 ， 在 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ”标签 中 
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的 “记录 集 导 航 条 ”按钮 副 ， 打 开 “ 记 录 集 导航 条 ”对 话 框 ， 选 中 要 导航 的 记录 集 以 及 导 





航 的 显示 方式 ， 然 后 单 击 “ 确 定 ” 投 钮 回 到 编辑 页 面 ， 此 时 页 面 则 出 现 该 记录 集 的 导航 条 。 





读者 可 以 修改 其 文字 效果 如 图 8-70 所 示 。 


记录 和 集 导航 条 








显示 方式 : @ 文本 


〇 OC 图像 








日 记 标 题 : {Rsl. log title} 


は エエ エエ エエ エト で エエ エエ エエ エエ エエ エエ エエ で ト エ エエ エマ ミエ エエ マ マエ で エエ エエ で で 


日 记 内 容 : {Rs1.log_content} 


トス ネト トト エ エエ エエ エエ エエ エエ エエ エエ エ エエ エエ エト エ エエ エ エエ エエ マ ママ エマ エエ マエ ママ で で エマ エマ エエ エ エエ マ エエ マ マエ エエ エエ で エマ エエ エエ エエ マエ エエ エエ マ マエ マエ エエ マ ママ エマ エエ エエ エエ エエ エエ エエ エエ マ エマ エエ エエ マエ マ エマ エエ エエ エエ エエ エエ マエ マエ マエ ママ ママ マエ エエ マエ エエ エエ エエ エエ エエ エエ マエ エエ エエ で マリ 


写 稿 人 : {Rs1.nssr_usernamei ” 写 摘 时 间 : {Rs1.1og addtime} 


トス スト トト トト トト トト エ エト トト トト トト ト トト トト トト エ エト エト エエ ささ エエ エエ エエ エエ マエ で で エエ で エエ エエ エエ エエ エエ エエ で エエ エエ エエ エエ エエ エエ で で で ママ マエ で エエ エエ エエ エ エエ エエ エ エエ エエ エエ エエ エ エエ エエ エエ エエ エエ エエ エト エエ エエ さ エエ エエ ママ エエ エ エエ エマ エエ エエ エ エエ エ エエ エエ さ エエ で で で 


如 采 冬 合 此 条 件 则 显示 . . . 


ww 


回复 标题 : {Rs2. reply_title} 


トト ト トト トト エ エマ エエ エエ エマ エエ マエ エエ エエ エ エエ エエ で で で で で で で で で で で で で で エト エエ エ エエ エエ エエ エエ エエ エエ エエ マ ミエ エエ エエ エエ エエ エエ で エエ で エエ エエ さ エエ エエ エエ エエ エエ エエ エエ エエ ママ エエ エエ エマ エマ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エマ エエ エエ エエ エマ エエ エエ エエ エエ で で で で で 


回复 内 容 : {Rs2. reply_content} 


は ユエ トト エエ エエ マエ マエ マ エエ エマ エマ エエ エエ エエ エエ エエ エマ エマ エマ で で エエ エエ エ で エエ エエ エエ エエ エエ エ エエ エエ マネ エエ エマ エマ エエ エ エエ エエ エエ エエ エマ で エマ で エエ マ エマ エエ エエ マエ エエ エエ エエ ママ エエ で エエ エエ マ エネ エエ エエ エエ エ ネエ エエ エエ マエ エエ マエ エエ エマ エマ エエ エマ ママ エマ エエ エマ エマ エエ エエ マエ で で で で で 


回复 人 : {Rs2. reply_user} 回复 时 间 : {Rs2. reply_addtime} 


トト トト トト トト エ トミ エエ エエ エエ エ ミエ エエ エ エエ エエ で で エマ エエ で で で で エエ エエ で で で エエ エエ エエ エエ エエ エエ エエ エエ エエ エ ミエ エエ エエ エエ で ネエ で で エエ そ で で エエ エエ エエ エエ エエ で で エエ で エエ で エマ エエ エネ エエ エマ エネ エ エエ エエ エエ エエ エエ そ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ エエ マエ エエ エエ エエ エエ で で で で で 


員 末 符合 此 祭 件 如果 符合 此 失 件 吉 果 符合 此 き 如果 符合 此 

















8-70 加 入 “记录 集 导 航 条 ” 








首先 选 中 记录 集 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-71 所 示 。 


エモ トミ トキ トキ キモ モミ キキ キモ モモ モモ モモ モモ モモ モモ モモ モモ モモ モモ 


回复 标题 : {Rs2. reply title} 


も も も も も モモ モモ モモ モモ モモ モモ モモ モモ モモ モモ モミ モモ モモ モモ も モモ モモ モモ で モモ モモ モモ で モモ モモ モモ で モモ モモ モモ で モモ 


回复 内 容 : Rsg.reply_content} 


和 


回复 和: {Rs2. reply user} 回复 时 间 : (EEE replyw _ addtime} 


WW hh 


图 8-71 选中 有 记录 时 显示 的 表格 





单 击 “服务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 显 示 
区 域 ”一 “如 果 记 录 集 不 为 空 则 显示 区 域 ” 选 项 ， 在 打开 的 “如 果 记 录 集 不 为 空 则 显示 区 
域 ”对 话 框 中 选择 记录 集 为 RS2， 再 单 击 “确定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 显示 
的 区 域 左 上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 ...” 的 灰色 卷 标 ， 这 表示 已 经 完成 设 定 ， 




















如 图 8-72 所 示 。 


如 果 记 录 集 不 为 空 则 显示 区 城 

















图 8-72 ”完成 设置 的 显示 图 标 
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选择 没有 回复 数据 时 要 显示 的 文学 “目前 无 回复 内 容 ， 请 回复 !*”， 根 据 前 面 的 
制作 步 又 ， 将 下 和 面 区域 设 定 成 “如 果 记 录 集 为 空 则 显示 区 域 "”” 如 图 8-73 所 示 。 


襄 果 记录 和 集 为 空 则 显示 区 城 








记录 条 
al | 取消 | 
下 助 J 














In 末 符 合 此 条件 則 品 示 . 議員 ば : 
目前 无 回复 内 容 ， 博 回复 ? | Re RT TE EO A OT ORE : 





图 8-73 ”选择 没有 数据 时 的 显示 内 容 


下 面 将 制作 “回复 栏 ”” 回复 栏 和 表面 的 留言 板 系统 一 样 ， 将 回复 的 信息 添加 
到 数据 表 log reply 中 ， 设 计 中 表单 forml 中 的 文本 域 和 文本 区 域 设 置 见 表 8-2， 其 静态 页 面 
设计 效果 如 图 8-74 所 示 。 











表 8-2 form1 中 的 文本 域 和 文本 区 域 设置 


文 本 (区 ) 域 /按钮 名 称 类 型 


I 区 
本 品 
a 和 
に を 
ここ EY 


ll 


NN SE A A A A nd 
小 ・ 
TRAIN 
题 : 
标题 : 
| 
一 | 
で * 
昔 ・ 
| 


ee Ot 
图 8-74 回复 栏 的 静态 页 面 设 计 效 果 
执行 菜单 栏 中 的 “插入 记录 ”一 “表单 ”一 “隐藏 区域” 命令 ， 在 表单 中 插入 


一 个 隐藏 区域 ， 单 击 选择 该 隐 饿 区 域 ， 在 属性 面板 中 设置 名 称 为 log ID ， 值 等 于 
<%=request.querystring("log ID")%>// 其 中 Request.QueryString 就 是 获取 你 请 求 页 面 时 传递 的 
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参数 ， 设 置 如 图 8-75 所 示 。 
it pm っ っ = ラ 
IN| | 
legI | 信和 MD | 人 request, querystring("log ID") 多 SF 


图 8-75 ”设置 隐藏 区 域 


选择 “应 用 程序 ”一 “服务 器 行为 ”面板 中 加 号 “+” 按 钮 ， 在 弹出 的 选项 
中 ， 选 择 “ 插 入 记录 ”选项 ， 打 开 “ 插 入 记录 ”对 话 框 ， 具 体 设置 参数 如 图 8-76 所 示 。 





EE 
插 六 到 表格 : log_reply w| 
插入 后 ， 转 到 : log_content. asp | 浏览 


获 职 值 自 : fornl 回 三 提交 时 ) 























表单 元 来 : | 生生 pl 1 
|1og_TD 神 件 ) 

EE ti ee rl. title" 

reply_content 质 入 到 | 列 中 “Yeply_content” 中 





列 |: |reply_ 1ser a 


提交 为: | 文本 v 











图 8-76 设置 “搬入 记录 ”对 话 框 


早 击 “人 确定 ”按钮 ， 回 到 编辑 页 面 ， 完 成 插入 记录 的 设计 。 

加 入 “检验 表单 ”行为 。 具 体操 作 是 在 log_content.asp 的 标签 检测 区 中 ， 单 
击 <form1>0 标签 ， 然 后 单 击 “ 行 为 ”面板 中 的 “+” 号 按钮 ， 在 弹出 的 菜单 中 ， 选 择 “ 检 
验 表 单 ” 命 令 ， 检 验 表 单行 为 会 根据 表单 的 内 容 设 定 检查 的 方式 ， 在 此 为 了 使 访问 者 全 部 
填写 ， 在 “ 值 ” 后 面 选择 “必需 的 ” 单 选 按钮 ， 这 样 就 可 完成 检验 表单 的 行为 设 定 了 ， 设 
置 如 图 8-77 所 示 。 











[input reply_ user” IE 
plr title" BE 
‘reply content” TR 


: で 在 何 东 西 〇 数字 
( 〇 电 子 邮件 地 址 〇 数字 从 | | 到 | | 





图 8-77 检验 表单 
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单 击 “ 确 定 ” 按 钮 ， 完 成 日 记 详 细 页 面 log content.asp 的 设计 与 制作 ， 完 成 后 
的 页 面 效 果 如 图 8-78 所 示 。 


DV 文件 (F) 编辑 (EF) 查看 (W) 插入 (I) 修 改 ) 格式 (0) 命令 (C) 站 点 (s) 窗口 (和 ) ”和 才 助 (0) | | 设计 器 


1 3 
| Adobe BrowserLab | BrowserLab 
cornblog. asp style. css ーー 


| RR RA RB i WE | i, Ker Taseript 
上 & 中 3 の 地 址 : file:///D|/chap08/log_content. asp 记录 集 Rs1) 
ーー 记录 集 Rs2) 
tI Se 
浊 记 标题 {Rsl.log_title} : 动态 净 本 (Rs1.1og content) 


提 记 内 容 : {Rs1. log_content} : 动态 净 本 (Rsl. log_addtime】 
写 稿 人 : [Rs1. user_username} 写 搞 时 间 : {Rsl. log_addtime} 9 重复 区 域 (Rs2) 
vote 如 果 记 录 集 不 为 空 则 显示 (Rs2) 
和 如果 符合 全 此 条 件 则 显示 . 1 动态 人 净 本 (Rs2. reply_title) 
动态 人 净 本 (Rs2. reply_content) 
动态 人 净 本 (Rs2. reply_user) 
回复 标题 : {Rs2. reply_title} 动态 女 本 (Rs2. reply_addtime) 


で で で で で で で で で で で で で すす で すす すす です で で です そそ す で で で で で で すす すす で で すそ で すそ で そそ すそ すそ そそ すそ で すそ で すそ すそ すそ で すす です で すそ すす で すそ で です そそ すそ すす すそ すす で すそ で すす で すそ すす です すそ すそ で すそ すそ で すす です すそ すそ で です すそ で すす すそ すす です すす すす すそ す すそ で すす で すま で 宇和 すま 


回复 内 容 : {Rs2. reply_content} 如 果 不 是 第 一 条 记录 则 显示 (Rs2) 


| いさ ヾ ささ ささい ささ ささ ささ ささ ささ ささ ささき ささ さ ささき きき さき さき きき ささ や きき きき さき きき きき さき きき さき きき きき きき きき さき きき きき きき きき ささ きき さき きき きき きき や やき やき さき きき や きき きき や きき きき きき きき きき や や さき きき きき きき きき きき きき さき きき きき きき やや きき きき きき きき きき さき や や きき さや きき きき きき やき さき て くく ov SS 称 至 第 条 记录 (Rs2) 
一 
5 1 
由 Rs2 dd 
回复 人 : {Rs2. reply_user} 回复 时 间 : s2. reply_addtime 日 号 二 
a 
て て て て くく くく いい いい いい いふ いく いい いく いい いき べべ いく きい い いき さい くき べき きく くさ べ べき きき きき さき きき きき きく きき き きい きき くき き べき きき きく きき きい きき くき く きき くき きき くく きい いい きき さき きく きき きく きき きき い きき くき きき きい きき きく きき きい きき きき きき きき きき きく きき きき きき くき きき く きき きき さく さい | 十 :AT (Rs2) 


ee 移 至 前 一 条 记录 CRs2) = 
如 未 符合 此 条 件 a 此 条 件 a 合 上 条 HS 未 a 如 果 不 是 最 后 一 条 记录 则 显示 (Rs2) 


“a 


I 








log_content. asp Xx D:\chap08log_content. asp 


























ca 上 全. 





四 か G dy “本 と Al 
i 昵称 : | | 型 9 は ク 


トト よ よい エエ エエ スエ エエ エエ エエ ネエ ネエ ネエ ネエ ネエ ネエ エネ エミ ネネ ミエ ネエ ネネ ネネ ネネ ネネ ネネ トト トミ で ミト ミト トト ミト よ ト よ トト トト トト トト よ トト トト トト ミト よ よ よ よ よさ よさ よさ よさ さよ よさ よさ さよ さよ ささ そそ すそ すさ で すさ で さす 








で で で で すす で すす で すす で すす です です 


admin 1og_ty. . 
sdnin log ty 这 
blog_type. asp 
check. asp 

err. asp 


| | 岗 | ーー index. asp 
< も ody> <div#top> T48 x 455y 275 K /6 秒 简体 中 文 (GB2312) i indsx.htm1 





1og class. asp 
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8-78 ”日 记 详细 页 和 面 log_content.asp 的 效果 图 


博客 个 人 主页 面 


博客 个 人 主页 面 userasp 主要 由 日 记分 类 、 最 新 留言 及 日 记 内 容 儿 个 栏目 组 成 ， 静 态 页 
面 的 设计 效果 如 图 8-79 所 示 。 


ED: \chap0s\user. asp CXHTML)* に 3 








conrub]og.asp calendar.css style.css 
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法 表 于 : ”详细 内 容 


で で で で で で で で で すす で で すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす す すす で すす で で で で で で で で で ざ で で で ざす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす すす で で すす すす すす す すす すす すす すす 
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关于 我 /新 闻 公 告 /我 的 好 点 /县 近 访客 /最 新 评论 /县 新 鲁 


| 
<body> <div#bottom> <div#copyright>Kime】] 








图 8-79 个 人 博客 主页 面 效 果 














博客 系统 


详细 的 制作 步骤 如 下 : 

创建 userasp 前 态 页 面 ， 因 为 博客 主页 和 面 和 博客 分 类 页 和 面部 由 
user usernameURL 变量 传递 到 userasp 页 面 ， 因 此 可 以 用 user username 字段 的 “URL 参 
数 ” 建 立 一 个 日 记 的 记录 集 。 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 
钮 ， 在 打开 的 列表 沫 单 中 选择 “记录 集 (查询)” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 其 体 参 数 
设置 如 图 8-80 所 示 。 








名称 


和 连接: cormbloe | EY. 


下 格 : 


列 : で) 全 部 ”中 选 定 的 : 


4 





图 8-80 ” 绑 定 记录 集 Rs1 
单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs1 的 绑 定 ， 把 绑 定 的 Rsl 中 的 字段 插入 到 个 
人 博客 主页 面 的 适应 位 置 ， 如 图 8-81 所 示 。 


是 。 永 恒 的 记忆 1! 


小 表 于 : {Rs1.log_addtime} 详细 内 容 


关于 我 /新 闻 公 堂 /我 的 好 点 /最 近 访 客 / 最 新 评 众 /最 新 贸 





图 8-81 插入 字段 


在 个 人 博客 主页 面 中 应 显示 所 有 日 记 或 部 分 日 记 的 记录 ， 而 目前 的 设 定 只 能 显 
未 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 右 行 为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 表 
格 ， 如 图 8-82 所 示 。 
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图 8-82 ”选择 要 重复 的 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 设 置 显示 的 记录 数 
为 5， 如 图 8-83 所 示 。 














图 8-83 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

加 入 “记录 集 导航 条 ”以 便 分 页 显示 日 记 的 数据 ， 将 鼠标 移 至 要 加 入 “记录 集 
导航 条 ”的 位 置 ， 单 击 “ 揪 入 ”工具 栏 中 的 “数据 ”标签 中 的 “记录 集 导 航 条 ”按钮 国 ， 在 
打开 的 “记录 集 导 航 条 ”对 话 框 中 ， 选 中 要 导航 的 记录 集 以 及 导航 的 显示 方式 ， 然 后 单 击 
“确定 ”按钮 回 到 编辑 页 面 ， 此 时 页 面 则 出 现 该 记录 集 的 导航 条 。 读 者 可 以 修改 其 文字 效 
果 ， 如 图 8-84 所 示 。 
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8-84 加 入 “记录 集 导 航 条 ” 
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把 鼠标 移 全 要 加 入 “记录 集 导 航 状 态 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 状 态 ” 按 钮 蜀 ， 打 开 “ 记 录 集 导航 状态 ”对 话 框 ， 选 中 要 显示 状 
态 的 记录 集 后 ， 再 单 击 “确定 ” 投 钮 回 到 编辑 页 面 ， 此 时 页 面 则 出 现 该 记录 集 的 导航 状态 ， 
设置 及 效 朱 如 图 8-85 所 示 。 




















a 记录 1 到 5 (总 共 10 个 记录 





a 回 ES 
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| 


は 3 et Ter_siatis a | 
: i lt a 








8-85 加 入 “记录 集 导航 状态 ” 


插入 “记录 集 导 航 条 ”和 “记录 集 导 航 状 态 ” 后 选中 编辑 页 面 中 的 “详细 内 
容 ” 文 字 ， 有 再 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 
的 沫 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 
览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选择 站 点 中 的 log_content.asp， 将 “传递 URL 参数 ” 
设置 为 log ID， 设 置 如 图 8-86 所 示 。 














苇 到 年 细 砚 面 


i 
人 iRr 参数 .oe_ 配 | 设 轩 为 以 下 项 的 人 


列 
传递 现 有 参数 ; 站 umr 参数 
| ] 表单 参数 





8-86 ”设置 “ 转 到 详细 页 面 ”对 话 框 


单 击 “ 确 定 ” 按 钮 ， 完 成 个 人 博客 主页 面 中 的 日 记 内 容 栏目 制作 ， 现 在 对 日 记 

分 类 这 一 栏 进行 制作 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “十 ”按钮 ， 在 打 

开 的 列表 菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 杠 ， 参 数 设 置 如 图 8-87 
所 示 。 
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名 称 : 噩 


连接 : | connblog 


表格 : log type 


列 : で 全 部 〇 选 定 的 : 











第 选 : Pe 
排序 : | 无 














图 8-87 ” 绑 定 记录 集 Rs2 
单 击 “确定 ”按钮 ， 完 成 记录 集 Rs2 的 绑 定 ， 把 绑 定 的 Rs2 中 的 字段 插入 个 人 
博客 页 面 日 记分 类 栏 中 的 适当 位 置 ， 如 图 8-88 所 示 。 
加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 要 重复 显示 的 表格 ， 如 图 
8-89 所 示 。 
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{Rs2. log_class_name} : 


トト よさ よそ さそ そそ そそ そそ そよ そ そそ そそ そそ で そそ そそ そそ そそ そそ さそ そそ ささ そそ よそ よさ 


に エエ エエ エエ エエ エエ さて ささ ささ エエ エマ エエ エエ で エエ で さそ で そそ で そそ で さて エエ そそ で で で で さい 


图 8-88 ”插入 字段 图 8-89 选择 要 重复 的 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 一 次 可 以 显示 
的 记录 数 为 “所 有 记录 ” 如 图 8-90 所 示 。 














图 8-90 ”选择 一 次 可 以 显示 的 记录 为 “所 有 记录 ” 





单 击 “确定 ”按钮 回 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 左 上 角 出 现 了 一 
个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

选中 编辑 页 面 中 的 Rs2.log class name 字段 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 服 
务 器 行为 ”标签 中 的 “+” 号 按钮 ， 在 弹出 的 菜单 列表 中 选择 “ 转 到 详细 页 面 ”选项 ， 在 打 
开 的 “ 转 到 详细 页 面 ”对 话 框 中 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 
中 的 log class.asp， 将 “传递 URL 参数 ”设置 为 log class ID， 设置 如 图 8-91 所 示 。 


























第 8 章 人 于 :元 





链接 : | "< (Rs2. Fia1ds: Tem Lele w | 





详细 信息 幢 : /1og_class. asp 
传递 URL 参数 : 1og_c1ass_TD | 设置 为 以 下 项 的 
记录 集 : Rs2 op 
列 : cg a 
传递 现 有 参数 : | ] umr 参数 


| 表单 参数 














图 8-91 设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 完成 制作 。 接 看 制作 “最 新 回复 ”功能 ， 单 击 “ 应 用 程序 ” 
面板 中 的 “ 绑 定 ”标签 中 的 “+” 瑟 按钮 ， 在 打开 的 列表 有 亲 早 中 选择 “记录 集 ( 俘 询 )” 选 
项 ， 打 开 “ 记 录 集 ”对 话 框 ， 丫 击 “ 局 级 ”按钮 进入 “局 级 ”模式 ， 在 “局 级 ”模式 中 输入 
如 图 8-92 所 示 的 参数 。 
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图 8-92” 绑 定 记 录 集 Rs3 


代 但 说 明 : 


SELECTblog log.log ID,blog log.user username,blog log.log addtime,log reply.* 

FROM blog log,log reply 

WHERE blog log.user_username デ MMuserAnd blog log.log ID=log reply.log ID 

/在 回复 表 没 有 所 从 属 的 主题 日 记 的 相关 信息 ， 用 条 件 blog log.log ID=log reply.log ID 来 获取 信 
忌 , 井 用 blog log.user username='MMuser' 来 限制 用 户 。 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs3 的 绑 定 ， 将 Rs3 记录 集中 的 reply_ttle 字 
段 插 入 到 “最 新 回复 ”栏目 中 ， 如 图 8-93 所 示 。 

选中 reply_title 字段 所在 的 表格 ， 单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 堪 行 
为 ”标签 中 的 加 号 “+” 按 钮 。 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 一 
次 可 以 显示 的 记录 数 为 5, 如 較 8-94 所 示 。 





















人 


Dreamweaver CS5+ASP 动态 网 站 建设 从 入 门 到 精通 第 2 版 


EE 


ーー 








图 8-93 搬入 reply ttle 字段 图 8-94 选择 一 次 可 以 显示 的 记录 数 
单 击 “确定 ” 投 钮 ， 完 成 设置 ， 再 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 


的 加 号 “+” 号 按钮 ， 在 打开 的 列表 菜单 中 选择 “记录 集 〈 碍 询 )” 和 选项， 打开 “记录 集 ” 对 
话 框 ， 具 体 参 数 设 置 如 图 8-95 所 示 。 
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图 8-93 ” 绑 定 记录 集 Rs4 
单 击 “确定 ” 按 钮 ， 完 成 记录 集 Rs4 的 绑 定 ， 再 把 Rs4 记录 集中 的 
Rs4.user blog name 学 段 插入 人 到 “主题 ”说 明文 学 后 面 ， 完 成 后 的 效果 如 图 8-96 所 示 。 
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8-96 插入 user blog name 字段 
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8615 日 记分 类 内 容 页 面 


日记 分 类 内 容 页 面 用 于 显示 个 人 博客 日 记分 类 内 容 ， 页 面 设计 比较 简单 ， 效 果 如 图 8-97 








所 示 。 


Es chap081og_class.asp (KHTML)* a 
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关于 我 /新 闻 公堂 /我 的 好 上 友 / 最 近 访 客 / 最 新 评论 /最 新 贸 


に 1 


-| 
<body> <divimid> <div. content> 
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图 8-97 日 记分 类 内 容 效 果 图 


详细 制作 步骤 如 下 : 
创建 日 记分 类 内 容 的 静态 页 面 log_class.asp， 单 击 “ 应 用 程序 ”面板 中 “ 绑 


定 ” 标 签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 菜单 中 选择 “记录 和 集 (查询 )” 选 项 ， 打 开 “ 记 
录 集 ”对 话 框 ,，“ 记 录 集 ”对 话 框 中 的 参数 设置 如 图 8-98 所 示 。 
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8-98 ” 绑 定 记录 和 集 Rs 





单 击 “确定 ”按钮 ， 则 完成 对 记录 集 Rs 的 绑 定 ， 再 把 绑 定 的 记录 集 插入 到 网 
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页 的 相应 位 置 ， 如 图 8-99 所 示 。 


六 于 我 /新 闻 公 洁 / 我 的 好 上 友 / 最 近 坊 客 / 最 新 评 耸 / 最 新 留言 





图 8-99 ”插入 字段 到 网 页 中 
插入 字段 到 网 页 后 只 能 显示 一 条 记录 ， 而 系统 要 求 该 页 面 应 显示 所 有 或 部 分 记 
录 ， 所 以 要 加 入 “重复 区 域 ”设置 ， 单 击 要 重复 显示 的 表格 如 图 8-100 所 示 。 
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8-100 选择 要 重复 的 表格 


单 击 “应 用 程序 ”和 面板 群 组 中 的 “服务 占 行 为 ”标签 中 的 加 写 “+” 按 钮 。 在 
弹出 的 染 单 列表 中 ， 选 择 “ 重 复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 设 置 一 次 可 以 显示 


的 记录 数 为 5， 如 图 8-101 所 示 。 














8-101 选择 一 次 可 以 显示 的 记录 数 为 $ 
单 击 “ 确 定 ” 投 钮 问 到 编辑 页 面 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 
将 鼠标 移 至 要 加 入 “记录 集 导 航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “ 数 
全 |， 在 打开 的 对 话 杠 中， 选取 要 导航 的 记录 集 以 及 导 


据 ” 标 签 中 的 “记录 集 导 航 条 ” 投 钮 号 |， 
航 条 的 显示 方式 ， 然 后 单 击 “ 确 定 ” 按 钮 回 到 编辑 负面 ， 如 图 8-102 所 示 。 


标 题 : {Rs.loe_title} 


























8-102 ”插入 “记录 集 导 航 条 ” 














博客 系统 


选中 编辑 页 面 中 的 Rs.log title 学 段 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行 
为 ”标签 中 的 加 号 “+” 按 钮 ， 在 弹出 的 沫 单列 表 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 在 打开 的 
“ 转 到 详细 页 面 ” 对 话 框 中 单 击 “浏览 ”按钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 此 站 点 中 的 
log_content.asp， 将 “传递 URL 参数 ”设置 为 log_ID， 参 数 设置 如 网 8-103 所 示 。 
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飛 遂 現有 参 数 : | ] mL 参数 
由 表单 参数 


























8-103 ”设置 “ 转 到 详细 页 面 ” 对 话 框 
单 击 选 择 有 记录 时 要 显示 的 表格 ， 如 图 8-104 所 示 。 








: ou dR 1 此 过 候 如 采 罕 合 此 :如 采 符 合 i ; 
: 了 一 页 | : : : 斩 : 





8-104 选择 有 记录 时 要 显示 的 表格 


单 击 “应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 加 扎 “+” 按 钮 ， 在 弹出 
的 菜单 列表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 不 为 空 则 显示 区 域 ” 选 项 ， 打 开 “ 如 果 记 
录 集 不 为 空 则 显示 区 域 ” 对 话 框 ， 在 “记录 和 集 ”中 选择 Rs， 再 单 击 < 确定 ， 按钮 回 到 编辑 
页 面 ， 发 现 之 前 选中 要 显示 的 区 域 左 上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 …” 的 灰色 卷 
标 ， 这 表示 已 经 完成 议定 ， 设 置 及 效果 如 网 8-105 所 示 。 





























训 素 全 对 上 入 让 为 空 则 显示 区 茂 





图 8-105 ”记录 和 集 不 为 空 则 显示 设置 及 效果 
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选中 记录 集中 没有 数据 时 要 显示 的 文字 “目前 没 信 息 ”， 然 后 单 击 “ 应 用 程 
序 ” 面 板 中 的 “服务 喜 行 为 ”标签 中 的 加 号 “+” 按 钮 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 
为 空 则 显示 区 域 ” 选 项 ， 在 “记录 集 ” 中 选择 Rs， 再 单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 发 
现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 …” 的 灰色 郑 标 ， 这 
表示 已 经 完成 设 定 ， 效 果 如 图 8-106 所 示 。 


四 | D:Achap08\1log_class.asDp (XHTML) 回 






































如果 符合 此 条 件 则 显示 ， 


目前 没有 任何 信息 


关于 我 /新 闻 公 洁 / 我 的 好 友 / 最 近 访 客 /最 新 评 伦 /最 新 留言 
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く body> <div#top> 





8-106 ”记录 集 为 空 时 显示 的 效果 





至 此 ， 日 记分 类 内 容 页 面 的 设计 与 制作 就 已 经 完成 了 。 


博 各 系统 后 台 设 计 


在 首页 index.asp 的 用 户 登 录 栏 中 ， 当 用 户 登 录 成 功 时 则 转 癌 check.asp， 当 用 户 登 录 
失败 时 则 转 到 errasp 页 面 。 一 般 用 户 只 可 能 对 目 己 的 日 记分 类 和 日 记 列 表 进 行 管理 ， 而 
管理 员 除 了 对 目 己 的 日 记 进 行 管 理 外 ， 还 可 以 对 用 户 信 息 、 用 户 日 记 和 博客 分 类 信息 进 
行 管 理 。 


月 上 管理 登录 身份 判断 


check.asp 页 面 通过 if 条件 判 断 语 句 对 转 过 来 的 用 户 名 字段 user_username 进行 判断 
是 不 是 admin， 如 果 是 再 转 癌 admin.asp， 如 果 不 是 则 转 同 user admin.asp， 话 细 制 作 步 又 
如 下 : 

用 户 成 功 登 录 后 转 到 check.asp 页 面 ，check.asp 页 面 比较 简单 ， 就 是 在 里 面 
加 入 一 段 下 条 件 判 断 语 句 和 绑 定 一 个 MM username 的 阶段 变量 ， 单 击 “ 应 用 程序 ”面板 
中 的 “ 绑 定 ”标签 中 的 加 号 “+” 授 钮 ， 在 打开 的 列表 有 末 早 中 选择 “阶段 变量 ”命令 ， 打 
开 “ 阶 段 变 量 ” 对 话 框 ， 在 打开 的 “阶段 变量 ”对 话 框 中 设置 其 名 称 为 MM_username， 如 
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8-107 所 示 。 


阶段 故里 


名称 : MN_us ername © | 


























图 8-107 设置 阶段 变量 名 称 


单 击 “ 确 定 ” 按 钮 ， 完 成 阶段 变量 MM_username 的 绑 定 ， 再 单 击 代 码 视 图 按 





钮 | 弛 共 码 回 到 代码 编辑 视图 ， 向 里 面 加 入 一 段 让 条 件 判断 语句 ， 代 码 如 下 : 


<% 

if session("MM Username")="admin" then 

/ 判断 传递 过 来 和 变量 用 户 名 是 否 是 admin 
response.Rednrect( "admin.asp") 

/ 如 果 是 admin 则 转向 admin.asp 

else 











response.Redirect("user admin.asp") 
/ 否则 转向 user admin.asp 

end if 

00>> 


用 户 在 index.asp 首页 中 登录 失败 则 转 癌 失败 页 面 errasp, errasp 是 提示 用 户 登 
孙 失 败 再 重新 登录 的 一 个 页 面 ， 效 末 如 网 8-108 所 示 。 




















Ts ni tchap08terr.asp [YHTML) -口交 


您 没有 注册 或 填写 错误 ， 请 重新 登录 ! | 





[TS x 138x 1 KE 1 秘 简体 中 训 GEg31gi 


图 8-108 ”登录 失败 页 面 


在 登录 失败 页 面 errasp 中 有 两 个 链接 ， 一 个 是 没有 注册 时 单 击 文学 “注册 ” 
链接 到 注册 页 耐 registerasp《〈 用 户 注册 介绍 ， 本 童 将 不 再 说 明 )， 态 外 一 个 是 填 号 错误 时 单 击 
文字 “和 登录” 则 返回 到 首页 ， 用 户 可 重新 登录 。 


8.42 管理 主页 面 功 能 ) 


- 般 用 户 后 台 管 理 页 面 用 于 用 户 登 录 成 功 后 ， 通 过 该 页 面 可 以 对 自己 的 注册 资料 进行 修 
改 ， 同 时 还 可 以 对 目 己 的 日 记分 类 和 日 记 列 表 进 行 修 改 、 删 除 和 添加 等 操作 。 静 态 页 面 的 设 
计 效 果 如 图 8-109 所 示 。 
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で ni い chap08tnsex_admin.asp (KHTML)* = aly, 


EH connblog. asp style.css 〒 


蝎子 博客 


ニー ニニ ニー ニー ニー ニー ニニ ニー ニニ ニー ニニ ニニ ニニ ニー ニニ ニニ ニニ ニー ニー ニー こつ) 5 


您 好 : i 用 户 信 息 资 料 : 





























关于 我 /新 闻 公 堂 /我 的 好 点 /最 近 访 客 / 最 新 评 伦 /最 新 留言 


E-mail: jambola12B. com 


< 1 国 
body> <divimid> <div. content> [RI 869 x 452v 257 K/ 6 秒 简体 中 文 (582312)  .: 








8-109 一 般 用 户 后 人 台 管 理 页 面 效果 





制作 步骤 如 下 : 
在 user admin.asp 页 面 设计 中 表单 froml 中 的 文本 域 和 文本 区 域 设 置 见 
表 8-3。 





表 8-3 表单 ffom1 中 的 文本 域 和 文本 区 域 设置 


意 义 文 本 (区) 域 /按钮 名 称 类 型 
用 户 名 user username 单行 
用 户 密码 user password 单行 
博客 名 称 user blog name 单行 
用 户 邮 箱 user email 单行 
所 属 分 类 typename 列表 / 沫 单 
修改 Submit 提交 按钮 
取消 Submit2 重 设 按钮 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 “+” 按 钮 ， 在 打开 的 列表 荣 单 
中 选择 “阶段 变量 ”命令 ， 打 开 “ 阶 段 变量 ”对 话 框 ， 设 置 名 称 为 MM username， 设 置 如 
图 8-110 所 示 。 





陈 段 悉 里 
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8-110 设置 阶段 变量 MM username 














将 绑 定 的 阶段 变量 插入 到 网 页 user admin.asp 中 ， 如 图 8-111 所 示 。 





























关于 我 /新 闻 公 告 / 我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 Ll Rights Reseryed 


E-mail jamboBdle6, com 





8-111 插入 阶段 变量 MM username 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ” 标 签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 (查询 )” 选项， 打开 “记录 集 ” 对 话 框 ， 参 数 设置 如 图 8-112 所 示 。 


User ILI 
typename 

SE SerTLAMme 
se ass or 
User blog Tame 


请 选 : SE LBT TLITI 


阶段 变量 = MM username 





8-112 绑 定 记录 集 rs user 


单 击 “确定 ”按钮 ， 完 成 记录 集 rs user 的 绑 定 ， 把 绑 定 的 rs user 中 的 字段 插 
入 网 页 的 合适 位 置 ， 如 图 8-113 所 示 。 


用 户 信息 资料 : : 
+ 
: 
! 
> 
) 
1 
1 





8-113 ” 绑 定 字段 





2 
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在 “上 所属 分 类 ”一 位 中 需要 动态 绑 定 所 有 的 博客 分 关 ， 单 击 “ 应 用 程序 ” 
面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 荣 单 中 选择 “记录 集 〈 得 
询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 共 体 参 数 设 置 如 网 8-114 所 示 。 





名 称 : 回 
连接: | conmblog 
表格 : blog_type 


列 : @ 全部 〇 选 定 的 : 





图 8-114” 绑 定 记录 和 集 Rs 


单 击 选 择 type_name 列表 / 沫 单 ， 在 “属性 ”面板 中 选择 动态 按钮 区 动 世 .| 
打开 “动态 列表 / 染 单 ”对 话 框 ， 在 打开 的 “动态 列表 / 深 单 ”对 话 框 中 设置 “来 目 记录 集 的 
选项 ”为 Rs,“ 值 ”和 “标签 ”都 为 typename， 再 单 击 “ 选 取 值 等 于 ”后 面 的 加 图 标 ， 打 开 
“动态 数据 ”对 话 框 ， 在 打开 的 “动态 数据 ”对 话 框 中 选择 “ 域 ” 为 rs user 记录 集中 的 
typename 字段 ， 然 后 单 击 “ 确 定 ” 投 钮 回 到 “动态 列表 / 菜 和 单 ”对 话 框 ， 再 次 单 击 “ 确 定 ” 
按钮 完成 动态 数据 的 绑 定 。 设 置 如 图 8-115 所 示 。 


动态 列表 7 深 单 




















EEE 
ser ID 取消 








: | typeruame 





: | typename w 








: = (rs user. Pields. Iten (“typenar 





BD: 9- lrs user Fialds.Tten ("typene 





图 8-115 动态 数据 的 绑 定 
完成 记录 集 的 绑 定 后 ， 单 击 “ 服 务 喜 行 为 ”面板 中 的 加 号 “+” 按 钮 ， 从 打开 
的 荣 单 中 选择 “更 新 记录 ”命令 ， 为 网 页 添加 “更 新 记录 ”的 服务 需 行 为 。 
此 时 ， 将 打开 “更 新 记录 ”对 话 框 ， 在 对 话 框 中 输入 如 图 8-116 所 示 的 参数 。 
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连接 -ER 定义 


要 更 新 的 表格 : Users Ea 
选 职 记录 上 自 : 5 ser vy 
唯一 键 列 : | user_ID v| 加 数值 

在 更 新 后 ， 转 到 : jaser_adnin. ss | [WE 








获取 值 自 :| form1 ™ | ( 提 宙 時 
表单 元 素 : es sername 更 新 列 "user us i 
se。 中 Ce 区 本 ) 
mai 更新 区 es 
i name 電導 し name 7 区 本 











到 |: | User Username be 


提交 为 : | 文本 可 











图 8-116 “更 新 记录 ”对 话 框 设置 


单 击 “ 确 定 ” 按 钮 ， 完 成 更 新 记录 的 设置 。 用 户 可 以 单 击 “ 个 人 主页 ”进入 
用 户 个 人 的 博客 主页 面 ， 首 先 选 中 编辑 页 面 中 的 “个 人 主页 ”文学 ， 再 单 击 “应 用 程序 ” 
面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 ; 在 弹出 的 订单 列表 中 选择 “ 转 到 详细 
页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 框 中 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ” 
对 话 框 ， 选 择 此 站 点 中 的 userasp， 将 “传递 URL 参数 ”设置 为 user_username， 设 置 如 图 
8-117 所 示 。 

















链接 : | * 个 人 主页 ” 。 罰 
详细 信息 页 mser.asp 1 加 上 .|] 


传递 URL 参数 : user_nsernane | 设置 为 以 下 项 的 值 


传递 现 有 务 煞 : | | IRL 佑 娄 
| | 表单 参数 





图 8-117 设置 “ 转 到 详细 页 面 ” 对 话 框 








早 击 编辑 页 面 中 的 文学 “博客 主页 ”在 属性 面板 中 选择 “链接 ”文本 框 后 面 
的 浏览 文件 按钮 名， 打开 “选择 文件 ”对 话 框 ， 选 择 同一 站 点 中 的 首页 文件 index.asp。 

user admin.asp 页 面 还 要 为 用 户 提 供 链接 到 编辑 页 面 的 链接 ， 对 目 己 的 博客 
记 和 日 记分 类 的 添 加 、 修 改 和 删除 功能 ， 因 此 要 设 定 转 到 详细 页 面 功 能 ， hm 

能 够 根据 参数 值 从 数据 库 中 将 茶 一 条 数据 科 选 出 来 进行 编辑 。 单 击 页 面 中 的 “日 记分 其 管 

理 ” 文 学 然后 单 击 “ 服 务 器 行为 ”面板 中 的 加 写 “+” 按 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详 
细 页 面 ” 选 项 ， 在 打开 的 “ 转 到 详细 页 面 ” 对 话 杠 中， 在 “详细 信息 页 ”文本 框 中 输入 
admin log type.asp， 将 “传递 URL 参数 ”设置 为 记录 集 rs user 中 的 user username 字段， 
如 图 8-118 所 示 。 























2 


ンー 
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详细 信息 页 : [ladmin log type asp ーー 








传递 URL 参 数 : luser_username ，” 识 置 为 以 下 项 的 值 


记录 集 9 r Ss_us er 


传递 现 有 参数 : [ ] mr 参数 
し | 表单 参数 





图 8-118 设置 “ 转 到 详细 页 向 ”对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 选 中 编辑 页 面 中 “日 记 列表 管理 ”文字 然后 
单 击 “ 服 务 右 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 评 细 页 面 ”， 选 
项 ， 打 开 “ 转 到 详细 页 面 ” 对 话 框 。 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 
admin log _ class.asp， 将 “传递 URL 参数 ”设置 为 记录 和 集 rs user 中 的 user ID 字 段 , 其他 疫 
定 值 给 不 改变 其 默认 值 ， 如 图 8-119 所 示 。 








传递 URL 参数 : nser_TD | 设置 为 以 下 项 的 值 
记录 集 : rs_user yi 

列 : [user_ID 回 
传递 现 有 参数 : 站 ypL 参数 
口 ] 表单 参数 

















图 8-119 设置 “ 转 到 详细 页 面 ” 对 话 框 
选中 编辑 页 面 中 的 “注销 用 户 ” 文 字 ， 给 用 户 添加 一 个 注销 功能 ， 单 击 “ 应 
用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按钮 ， 在 弹出 的 菜单 列表 中 选择 “用 
户 身份 验证 /注销 用 户 ”选项 ， 在 “在 完成 后 ， 转 到 ”文中 框 中 输入 index.asp， 如 图 8-120 
所 示 。 








在 以 下 情况 下 注销 : Q | 单 击 链接 : | 


esse 2 


在 完成 后 ， 转 到 : |index. asp 





图 8-120 设置 “注销 用 户 ” 对 话 框 
单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 。 因 为 个 人 日 记 管 理 页 面 user admin.asp 是 通 
过 用 户 用 户 名 和 和 密码 进入 的 ， 所 以 不 希望 其 他 用 户 进 入 ， 这 就 需要 设置 用 户 的 权限 。 早 击 
“应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 号 “+” 投 钮 ， 在 弹出 的 染 单 列表 中 选择 
“用 户 喘 份 验证 /限制 对 页 的 访问 ”选项 ， 在 打开 的 “限制 对 页 的 访问 ”对 话 框 中 设置 “如 果 
访问 被 拒绝 ， 则 转 到 ”index.asp 页 面 ， 如 图 8-121 所 示 。 














基于 以 下 内 容 进 行 限制 : (や 。 用 户 名 和 密码 
〇 ”用 户 和 名、 密码 和 访问 级 别 


ーー 


如 果 访问 被 拒绝 ， 则 转 到 |: 








8-121 设置 “限制 对 页 的 访问 ”对 话 框 


早 击 “ 俏 定 ”按钮 则 完成 了 个 人 日 记 后 台 管 理 页 面 user admin.asp 的 制作 。 整 
体 页 面 设计 效 果 如 图 8-122 所 示 。 


ap sis ass UPT) -Dx 
CAD ceanbleg sp style err 7 








用 户 稍 息 尘 料 ; 


| 用 » 
| Give [MIO Too me 52v 206 E70 重体 申立 iz3iz) 


图 8-122 ”整体 页 面 设计 效果 图 
管理 员 后 台 管 理 页 耐 admin.asp 的 制作 与 个 人 博客 后 人 台 管 
同 ， 只 是 加 了 两 个 页 面 的 链接 ， 页 面 链接 如 下 : 
@ “博客 分 类 管理 ”链接 的 页 面 为 adtmin_ blog type.asp: 
@ “博客 列表 管理 ”链接 的 页 面 为 admin blog.asp。 
完成 的 效果 如 图 8-123 所 示 。 


Ep: echt is ssp (KFT) = 





个 
咽 
HH 
泊 
Ey 
Da 
コロ 
に 
> ト 
TT 














D 
ody) [Re Om ・ 261 下 /5 驳 | 精 伟 中 廊 (o82312) | 











8-123 管理 员 后 台 管 理 页 面 效果 图 
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:日 记分 类 管理 页 面 


日 记分 类 管理 页 面 admin log type.asp 是 个 人 日 记 后 台 管 理 主 页 面 通过 字段 user_ 
username 转 到 的 一 个 管理 页 面 ， 这 个 页 面 主要 为 用 户 提 供 添加 日 记分 类 和 链接 到 修改 、 删 除 
日 记分 类 的 功能 。 静 态 页 面 的 设计 效果 如 图 8-124 所 示 。 


ni い chapo8tadmin_1og_type.asp (XHTNL)* -Ox 











cormublog.asp style.css 


蝎子 博客 


; 添加 日 记分 类 : 











关于 我 /新 闻 公 告 /我 的 好 点 /最 近 访 客 /最 新 评论 /最 新 留言 





中 
<body> <div#top> <div#banner> <div. banner > LE 869 x 452v 254K ア BE 秘 简体 中 次 (G6B2312)  .; 





图 8-124 静态 页 面 的 设计 效果 


制作 步骤 如 下 : 

创建 该 页 面 的 静态 效果 ， 单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 
“+” 按 钮 ， 在 打开 的 列表 荣 单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 和 集 ” 对 话 框 ， 具 
体 参 数 设 置 如 图 8-125 所 示 。 








名 称 : 
表格 
列 : 外 全部 し) 选 定 的 : 


luz elass: TH 


SeL ロロ TFTLBIT 選 


loe elass- ame 
lug class Tnnm 


生計 ser msernanme = VF ーー 
于 
类 序 | 无 ” 图 由 和 





8-125 ” 绑 定 记录 集 Rs 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs 的 绑 定 ， 把 绑 定 的 记录 集 Rs 中 的 字段 














第 8 章 人 于 :元 





log class name 插入 到 网 页 的 适当 位 置 ， 如 图 8-126 所 示 。 


も 


= 
人 


图 8-126 插入 log class name 字段 


由 于 admin log type.asp 页 面 应 显示 数据 表 log type 中 的 所 有 记录 ， 而 目前 的 
设 定 只 能 显示 数据 库 的 第 一 条 数据 ， 因 此 ， 需 要 加 入 “服务 右 行 为 ”中 “重复 区 域 ” 设 定 ， 
单 击 admin log type.asp 页 面 中 的 表格 ， 如 图 8-127 所 示 。 


修改 删除 
图 8-127 选择 要 重复 显示 的 记录 和 集 表格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“+? 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 “重复 
区 域 ”对 话 框 中 ， 设 定 一 次 可 以 显示 的 记录 数 为 “所 有 记录 ”设置 如 图 8-128 所 示 。 












































图 8-128 选择 一 次 可 以 显示 的 记录 数 


单 击 “ 确 定 ” 鬼 钮 回 到 编辑 页 面 ， 友 现 之 前 选中 要 重复 的 区 域 的 元 上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

接 下 来 加 入 显示 区 域 的 设 定 。 如 果 数 据 库 中 有 效 据 希 望 显示 数据 。 首 先 选 取 记 
录 集 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-129 所 示 。 




















Rs.1ng class name} 


图 8-129 选择 要 显示 的 表格 


单 击 “应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 号 “+” 投 钮 ， 在 弹 
出 的 亲 单 列表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 来 记录 集 不 为 空 则 显示 区 域 ”选项 ， 打 开 “ 如 
条 记录 集 不 为 空 则 显示 区 域 ” 对 话 框 ， 在 “记录 集 ” 中 选择 Rs， 再 单 击 “ 确 定 ” 按 钮 回 到 
编辑 页 面 ， 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 .…” 
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的 灰色 大 标 ， 这 表示 已 经 完成 设 趾 ， 设 置 及 效果 如 图 8-130 所 示 。 
如果 记 录 集 不 为 空 则 显示 区 域 








图 8-130 ”记录 集 不 为 空 则 显示 的 区 域 








选中 记录 集 没 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-131 所 示 。 


大 日 记分 类 


图 8-131 选择 没有 的 数据 时 显示 的 区 域 





单 击 “ 应 用 程序 ”面板 中 的 “服务 右 行 为 ”标签 中 的 加 写 “+” 控 钮 ， 在 弹 
出 的 六 日 列表 中 ， 选 择 “ 显 示 区 域 ”一 “如 果 记 录 集 为 宇 则 显示 区 域 ”选项 ， 打 开 “ 如 
条 记录 集 为 空 则 显示 区 域 ” 对 话 框 ， 在 “记录 集 ” 中 选择 Rs， 青 单 击 “确定 ”按钮 问 到 
编辑 页 面 ， 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 .…” 
的 灰色 友 标 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 图 8-132 所 示 。 























襄 采 记录 集 为 空 则 显示 区 城 


记录 条， 








名 音符 客席 案 御 测评 寺 ， 


图 8-132 ”记录 集 为 宇 则 显示 区 域 











下 面 将 制作 添加 日 记分 类 ， 首 先 插入 一 个 隐藏 区域， 然后 将 绑 定 面板 中 
的 Session 变量 MM username 绑 定 到 表单 中 的 user username 隙 滅 域 中 , 如 関 8-133 
所 示 。 
| 


区 隊 裕 区 域 
mser_usernam 価 W) <%= Session("MM_username") %> | 多 








图 8-133 ” 绑 定 字段 到 隐藏 域 中 
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单 击 “ 应 用 程序 ”面板 中 “服务 亏 行 为 ”标签 中 的 加 号 “+” 投 钮 。 在 弹出 
的 订单 列表 中 ， 选 择 “ 插 入 记录 ”选项 ， 在 “插入 记录 ”对 话 框 中 按 如 图 8-134 所 示人 设置 





| 





获取 值 自 : | fornl | (在 提 变 时 ) 


表单 元 未 站 本 党 a 手 凡 到 列 中 "上 ng et 立 本 ] 
下 時 中 


user userIamej 庆 六 到 | 旨 中 "uasar userrame” 忆 


列 | : log_class_ name v 
提交 为 : 立 本 | 





图 8-134 ” 设 定 “插入 记录 ”对 话 框 


单 击 “ 人 确定” 按钮 完成 记录 的 搬入， 选择 表单 执行 末 单 栏 中 的 “窗口 ”一 “ 行 
为 ”命令 ， 打 开 “ 服 务 器 行为 ”面板 ， 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 打 
开 的 行为 列表 中 ， 选 择 “ 检 得 表单 ” 打开 “ 检 答 表单 ”对 话 框 ， 设 置 log_class_name 文本 
域 的 值 都 为 “必需 的 ” 可 接受 “任何 东西 ” 设置 如 网 8-135 所 示 。 











可 控 爱 : 外 性 何 东 西 〇 数 宇 
〇 电子 邮件 地 址 〇 ) 数字 从 | | 到 | | 





图 8-135 设置 “检查 表单 ”对 话 框 


页 面 编辑 中 的 文学 “修改 ”和 “删除 ”的 链接 ， 必 须 给 要 转 到 的 页 面 传递 参 
数 ， 这 样 前 往 的 页 面 才 能 够 根据 参数 值 从 数据 库 中 将 茶 一 条 数据 饶 选 出 来 进行 编辑 。 选 中 编 
辑 页 面 中 的 “修改 ”文字 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 选 
择 “ 转 到 详细 页 面 ”选项 ， 在 打开 “ 转 到 详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ”按钮 ， 打 开 “ 选 
择 文件 ”对 话 框 ， 选 择 admin log typeupd.asp， 将 “传递 URL 参数 ”设置 为 记录 集 Rs 中 的 
log class_ ID 学 段 ， 其 他 设置 保持 默认 值 ， 如 网 8-136 所 示 。 














链接 : “ 传 改 " マ 
详细 信息 页 
传递 VEL 参数 : 设置 为 以 下 项 的 值 
A 
選好 現有 参 数 : | ] umr 参数 
[| 表单 参数 





8-136 ”设置 “ 转 到 详细 页 面 ” 对 话 框 


选中 “删除 ”文学 并 重复 上 和 面 的 操作 ， 将 要 转 到 的 详细 页 面 改 为 admin log_ 
typedel.asp， 如 图 8-137 所 示 。 


转 到 详细 页 面 
ビ 可 
译 旨 信 息 页 [sanin loe tpeael sp = = La | 
传递 URL 参 数 : 设置 为 以 下 项 的 值 | 币 助 |] 
记录 入 zz 史 
列 : 
传递 现 有 参数 : [ ] umr 参数 
口 表单 参数 











8-137 设置“ 转 到 详细 页 面 ” 对 话 框 
单 击 “ 确 定 ” 按 钮 ， 完 成 日 记分 类 管理 页 面 admm log type.asp 的 制作 ， 效 果 
如 图 8-138 所 示 。 


で ni い chapostadmin_1og_type.asp CGHTML) - 口 X 


HR connblog. asp style. css 


蝎子 博 品 


: 添加 日 记分 类 : 





关于 我 /新 闻 公 上 /我 的 好 友 / 景 近 访 客 /最 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 如 1 Rights Reserved 


E-mail: jambold12B. com 


< 
人 body> <div#top? LE 869 x 452v| 264 K/ 6 秒 | 簡体 中 文 (GB2312)  : 





8-138 ”日 记分 类 管理 页 面 效果 














博客 系统 
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> 于 修改 日 记分 类 页 面 





接 下 来 要 设计 修改 日 记分 类 的 页 面 admin_log_typeupd.asp， 这 个 页 面 的 主要 功能 是 将 数 (>) 





据 表 中 的 数据 传送 到 页 面 的 表单 中 进行 修改 ， 修 改 数 据 后 再 更 新 到 数据 表 中 ， 页 面 设 计 如 图 
8-139 所 示 。 


pichapostadmin_1og_typaupd.asp (XHTL)* -Ox 


蝎子 博 品 


000 您 好 





关于 我 / 靳 闻 公 洁 / 我 的 好 友 / 最 近 坊 客 / 最 新 评论 /最 新 留言 





< > 
ody> Ca mi dy く diy. eontent> く form ま form1> 871 x 439v 252K ア BE 秘 簡体 中 立 (GB2312) os 
8-139 ”修改 日 记分 类 页 面 设计 


操作 步骤 如 下 : 

创建 admin log typeupd.asp 页 面 ， 并 单 击 “ 绑 定 ” 和 面板 中 的 加 亏 “+” 投 钮 ， 
在 弹出 的 选项 中 ， 选 择 “ 记 录 集 ( 合 询 )” 选 项 ， 打 开 “ 记 录 集 ” 对 话 框 蛙 击 “局 级 ” 控 钮 
进入 融 级 模式 窗口 ， 在 “记录 集 ” 对 话 框 中 输入 参数 如 图 8-140 所 示 ， 单 击 “确定 ” 投 钮 完 
成 议定 。 





名 称 : 转 
Er 


SQL: SELECT * | 
FROM log type 
WHERE 1og c1ass TI = MMColFaram and user username=’ muser’ 


参数 : +| [二 | 





i MMColF ar am 


QueryString ("1 

5 t+. trinel” So 
県 Reqnes ueryString ("log_ 
编辑 ... 





类 ”预存 过 程 


OFDER BY 





8-140” 设 定 Rs“ 记 录 集 ”对 话 框 








语法 说 明 : 


这 里 增加 了 MMColParam 和 muser 两 个 变量 ， 设 置 运行 值 分 别 为 session("MM username") 和 
Request.OueryString("log _ class ID?), 
SELECT * 


FROM log type 
WHERE log class ID = MMColParam and user username= muser 


/此 段 的 意思 为 根据 log class ID = MMColParam and user username='muser' 条 件 选 择 log type 数据 
表 中 所 有 的 字段 。 





绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 admin log typeupd.asp 网 页 的 适当 位 
曾 ， 如 图 8-141 所 示 。 


蜗 プ 博 = 风月 的 轮回 。 永 恒 的 记忆 1! 


Ri 你 好 





关于 我 /新 闻 公告 /我 的 好 友 / 最 近 访客 / 晤 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 AL1 Rights Reserve 
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8-141 字段 的 搬入 








完成 表单 的 布 阐 后 ， 要 在 admin log typeupd.asp 页 面 中 加 入 “服务 需 行 为 ”中 
“更 新 记录 ”的 设 定 ， 在 admm log typeupd.asp 页 面 中 ， 单 击 “应 用 程序 ”面板 中 的 “服务 
右 行 为 ”标签 中 的 加 号 “+” 按 钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “ 更 新 记录 ”选项 ， 打 开 
“更 新 记录 ”对 话 框 ， 其 体 参数 设置 如 网 8-142 所 示 。 








连接 | 入 
i 
选 职 记录 自 : Rs 
唯一 畠 列 : 数值 
在 更 新 后 ， 转 到 


获取 值 自 : = 一 nl 状 | (可 朗 时 ) 
表单 元 素 : 


an 
提 变 洲 : | 文本 wv 











8-142 ”设置 “更 狐 记录 ”对 话 框 














单 击 “ 确 定 ” 投 钮 回 到 编辑 页 面 ， 守 成 修改 日 记分 类 页 面 的 设计 ， 完 成 后 的 效 
果 如 图 8 8-143 所 示 。 


四 n:tchap08tadmin 1og_ typeupd.asp (XHTML) 


HA conmb1og.asp style. css 


喝 プ 二宮 





:Rs. user_username} 您 好 


关于 我 /新 闻 公 告 /我 的 好 皮 / 晴 近 访客 /最 新 评论 /最 新 留言 
他 一 一 一 一 = - 
<body> <div#top? [JR 871 x 439v| 257 K / 6 秒 | 简体 中 文 (582312) | 








图 8-143 ”完成 后 的 页 面 效果 


:和 删除 日 记分 类 页 面 


设计 删除 分 类 的 页 面 admin log typedelasp， 此 页 面 设计 和 修改 的 页 面 差 不 多 ， 如 网 
8-144 所 示 。 其 方法 是 将 表单 中 的 数据 从 站 点 的 数据 表 中 删除 。 


中 | D:Achap08admirn_ 1og_typedel.asp CKXHTML)* 











ENR connblog. asp style.css 


NOOOCXX 您 好 








关于 我 /新 闻 公 洁 / 我 的 好 友 / 最 近 访 客 / 最 新 评 众 / 最 新 久 


[= 


< | 








ody> Ca hi dy く diy. content> く form#Eorm1> | IR | 9 a 100% ~ 


8-144 ”删除 页 面 的 设计 








详细 制作 步骤 如 下 : 


创建 admin_log typedel.asp 页 面 ， 并 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 投 钮 ， 在 


弹出 的 选项 中 ， 选 择 “ 记 录 集 (人 查询)” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 参 数 设 置 如 图 8-145 
所 示 。 


3 


lue class 11 
Ser SerILam 所 
lug class rame 
loe class Tumnm 


| 
お | 
| 





8-143 ” 设 定 “记录 和 集 ” 对 话 框 





绑 定 记录 集 后 ， 将 记录 集中 的 字段 插入 至 admin log typedelLasp 网 页 的 适当 位 


置 ， 如 图 8-146 所 示 。 





由 子 博 放 风月 的 轮回 。 永 恒 的 记忆 1! 


dh 





关于 我 /新 闻 公 省 /我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 留言 Copyrieht 2000-2008 蝎子 记忆 AL Rights Reseryed 
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8-146 字段 的 插入 


搬入 一 个 隐 韦 区域， 然后 将 绑 定 面板 中 的 log class ID 绑 定 到 表单 中 的 


log class ID 隐藏 域 中 ， 如 图 8-147 所 示 。 











II 陷 凉 区 域 
Leelass TH 人 [Orths Fialds Tton Vlog cassml 人 
绑 定 字段 到 隐藏 域 中 


8-147 
“删除 记录 ”的 设 定 ， 在 admin log typedel. 三 页 面 中 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 














完成 表单 的 布置 后 ， 要 在 admin log typedel.asp 页 面 中 加 入 “服务 器 行为 ”中 
中 的 加 号 “+” 按 钮 。 在 弹出 的 保单 列表 中 ， 选 择 “ 删 除 记 录 ” 选 项 ， 在 打开 


| な ゴミ 人 
的 “删除 记录 ”对 话 杠 中， 输入 如 图 8-148 所 示 的 参 数 。 


器 行为 ”标签 
从 表格 中 删除 : 
选 了 记录 自 : | 
= 昌久 eu:m 可 
a 


提 変 此 表 単 罰則 除 : fornl ~ 
册 隆 后 ， 转 到 | : 
1 面 的 设计 ， 如 图 8-149 


图 8-148 议定 “删除 记录 ”对 话 框 





单 击 “确定 ”按钮 回 到 编辑 负面 ， 完 成 如 除 日 记分 


所 示 O 
窟 。 ni い chap08tadmin_1og_typede1 asp 〔YHTWL) 
HR connblog. asp style. css 


蝎子 博 吕 


{Rs. user_username} 您 好 


I00-2008 ne pe i Rights Reseryed 
mbola12B. com 


a] 
| 
1K ア 〆1 秒 簡体 中 立 (GEB2312) 


天 于 我 /新 闻 公 告 / 臣 的 好 点 /最近 访客 /最 新 评论/ 县 新 鱼 言 


完成 的 设计 效果 


8-149 





く 
< く body> <div#top> 









人 
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清唱 日 记 列表 管理 主页 面 


日 记 列 表 管 理 主 页 面 admin log class.asp 的 主要 功能 是 显示 所 有 上 日记， 并 通过 该 页 面 进 
入 到 日 记 修改 admin log classupd.asp 页 面 和 日 记 删 除 admin log classdel.asp 页 面 ， 而 且 还 
有 添加 日 记 的 功能 。 页 面 设计 效 末 如 图 8-150 所 示 。 


中 | D:Achap08admin_ 1og class.asp (KHTML)* 























蝎子 博客 


日 记 列表 管理 : 











提交 | | 重 置 | 


TT 





< 而 | > 
<body> <diymid> <div. content1> [RD 00% y8Tlx5lTy268K/B 秒 筒 体 中 文 (GB2312)  .: 








8-1S0 日 记 列 表 管 理 页 面 效果 图 


制作 步骤 如 下 : 
创建 该 页 面 的 静态 效 朱 ， 单 击 “ 绑 定 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选项 
中 ， 选 择 “ 记 录 集 (会 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 并 早 击 “局 级 ”按钮 进入 局 级 模式 


窗口 ， 打 开 “ 记 录 集 ”对 话 框 中 按 如 图 8-151 所 示 输 入 参数 ， 单 击 “ 确 定 ” 按 钮 完成 设 定 。 

















和 
连接 : | cennb1og 











FROM bloe loe, log type 

WHERE blog log. user username=’ muser hnd 
1og_type.1og_ class TI=blog 1og.1og class_Il 
DRDER BY blog 1og.1og TI DESC 


添加 到 SaL: 


WHERE 


URIER BY 


类 ”预存 过 程 








8-1S1 设 定 Rs“ 记录 集 ” 对 话 框 
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语法 说 明 : 
SELECT blog log.*,log type.log class ID,log type.log class name 
FROM blog log,log type 
WHEREblog log.user username='muser'And log type.log class ID=blog log.log class ID O) 
ORDER BY blog log.log ID DESC i 


/通过 blog log.user username='muser'And log type.log class ID=blog log.log class ID 条件 , 投 
blog log.log ID 降序 条 件 ， 从 blog log 和 log type 两 个 数据 表 中 选择 出 相应 的 字段 。 


绑 定 记录 后 ， 将 log title 字段 和 log class name 字段 插入 到 网 页 的 适当 位 置 ， 
如 图 8-152 所 示 。 








Es: ge m 
[三 
イイ スス イス TTY テッ スイ リエ ッッ きけ イエ テイ チャ エイ イサ イイ イイ サイ スー ナイ スス テス イイ イト トイ 
标题 日 记分 类 管理 
CC RR DO 
| 、 
A . » 
: : 
Rs.1og title} : {Rs. 1og_class_name}】 鞭 改 删 际 

: に 


EE SS NO SS i OS a a oe i oe oO A EE i OR FO EA OE Oe a A a A a a or 


こそ そそ そそ そそ そそ すそ すそ そそ そそ そそ そそ て そそ すそ て で そそ て すそ そそ そそ で すそ すそ そそ そそ そそ そそ そそ て そそ て そそ そそ そそ すそ て そそ そそ すそ そそ て そそ て そそ て そ そそ そそ て て て そそ そそ そそ そそ て すそ すそ て そそ そそ そそ そそ て そそ て そそ て そそ て そそ て そそ て そそ すそ そそ で て そそ で 1 


图 8-152 插入 字段 
由 于 admm log class.asp 页 面 用 于 显示 所 有 用 户 日 记 列 表 的 记录 ， 而 目前 的 设 
定 只 能 显示 数据 库 的 第 一 条 数据 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 
单 击 admin log class.asp 页 面 中 要 重复 显示 的 表格 ， 如 图 8-153 所 示 。 


に も も も も も も も も も も も も も も もせ も も も も モモ モミ モミ モト トミ モミ モモ トモ セト ミミ モモ エキ キト モ ミエ トモ トト キミ キモ ミセ モモ ミエ トモ エモ キセキ エモ ミミ トモ トモ ミミ トミ トモ トモ トミ ミミ トト キ トミ ミミ エモ トモ セト トミ ミキ モモ トト キミ モミ トモ トキ ミセ モモ モト を 





























和 


图 8-153 ”选择 要 重复 显示 的 表格 
单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 载 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“+?” 按 钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 “重复 
区 域 ” 对 话 框 中 ， 设 定 一 次 显示 的 记录 数 为 “所 有 记录 ” 如 图 8-154 所 示 。 





























图 8-154 选择 要 重复 显示 记录 集 的 数目 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 耐 ， 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 
一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

依照 记录 集 有 的 状况 或 条 件 来 判别 是 人 否 要 显示 网 页 中 的 条 些 区 域 ， 这 束 古 显示 区 
域 的 设 定 ， 首 先 选 中 记录 集 有 数据 时 要 显示 的 数据 表格 ， 如 疼 8-155 所 示 。 























列表 管 = 
和 


人 标 ”是 日 证 分 类 : 管理 


| s. long title} 8 {Es. lng class name} 狠 改 删除 








图 8-155 选择 有 数据 时 要 显示 的 数据 









-二 
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单 击 “ 应 用 程序 ”面板 中 的 “服务 喜 行 为 ”标签 中 的 “+” 亏 按钮 ， 在 弹出 的 
末 单 列表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 果 记 录 集 不 为 空 则 显示 区 域 ”选项 ， 打 开 “ 如 果 记 录 
集 不 为 宇 则 显示 区 域 ” 对 话 框 ， 在 “记录 集 ” 中 选择 “Rs” 再 单 击 “ 确 定 ” 投 钮 加 到 编辑 页 
面 ， 将 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 …” 的 灰色 
卷 标 ， 这 表示 已 经 完成 设 定 ， 设 置 及 效果 如 几 8-156 所 示 。 





























邓 来 全 承 集 趟 为 空 则 坚 示 区 茂 





网 了 電 吉 。。。 轮回 。 永 恒 的 记忆 ! 





和 


E 議 标 大 : 日 岩美 : 管理 


Rs. lag tit]ai 5 {Rs. loe class namel 瘀 改 删 除 











St Es 


8-156 ”记录 集 不 为 空 则 显示 








选中 记录 集 没 有 数据 时 要 显示 的 数据 表格 ， 如 图 8-157 所 示 。 


目前 无 日 记 ， 博 弯 加 日 记 ， 


ピュ ニン ニョ ョ ッ ルン ーー ニョ ニョ スン l ョ ーー ニョ ンー ニョ ンー ニョ エー ニョ イニ ョ bl Bee ete Bee alle Be Cm Bee Pana Bee mln fs ee Bee elle エニ ョ イニ ョ イニ ョ コー デニ ョ スコ lq Bee mn Ba le fie ee Fa elle Bee mle Bee i Be a Bm elle Rn ee Ben elle Bn mln Bs Salle Be ami Bee mn Bee ele Bee elle fn mn Be le Be nen Bee "= Be "Se Be ln om 


8-157 ”选中 没有 数据 时 要 显示 的 区 域 


单 击 “ 应 用 程序 ”面板 中 的 “服务 需 行 为 ”标签 中 的 加 号 “+” 投 钮 ， 在 弹 
出 的 六 单列 表 中 ， 选 择 “ 显 示 区 域 ” 一 “如 来 记录 集 为 容 则 显示 区 域 ”选项 ， 打 开 “ 如 果 
记录 集 为 空 则 显示 区 域 ”对 话 框 ， 在 “记录 集 ” 中 选择 Rs， 青 单 击 “确定 ”按钮 回 到 编 
辑 页 面 ， 将 发 现 之 前 选中 要 显示 的 区 域 的 左上 角 出 现 了 一 个 “如 果 符 合 此 条 件 则 显示 .…” 
的 灰色 否 标 ， 这 表示 已 经 完成 设 是 ， 设 置 及 效 末 如 图 8-158 所 示 。 



































邓 来 记 承 集 为 空 则 显示 医 城 






如 束 罕 全 此 条 件 则 显示 .… . 
目前 天 日 记 ，; 博 汪 加 日 记 





Bde Bae ede Bee ee Ba ee Bee ele Be ele Be ee Ben lle Bee Sle Bee a Bee lle ae "am Bee elle Be lle Be elle Rn elle Be ele Bee ele Be ed Be el Be ee Bae ed Be de Be ee Bee ede Bee lle Be le Bee Talla Bee elle Bee elle Be ui le el 


8-1S8 ”记录 集 为 空 则 显示 的 区 域 
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把 限 标 移 人 至 要 加 入 “记录 和 集 导航 条 ”的 位 置 ， 单 击 “ 择 入 ”工具 栏 中 的 “ 数 
据 ” 标 签 中 的 “记录 集 导 航 条 ”按钮 事 |， 打 开 “ 记 录 集 导航 条 ”对 话 框 ， 选 取 要 导航 的 记 
录 集 以 及 导航 的 显示 方式 ， 然 后 单 击 “确定 ”按钮 回 到 编辑 页 面 ， 此 时 页 面 将 出 现 该 记录 集 。 
的 导航 条 ， 如 图 8-159 所 示 。 已 ) 








记 邓 集 写 有 条 





: 和 己 吉 末 装 台 i il 此 条 件 | IM 


冲 - 页 | 了 -页 | 个 页 | 展 后 -页 | 


图 8-159 ”加 入 “记录 和 集 导 航 条 ” 





选中 编辑 页 面 中 的 字段 Rs.log_title， 然 后 单 击 “服务 器 行为 ”面板 中 的 “+” 
按钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 打 开 “ 转 到 详细 页 面 ” 对 话 框 ， 蛙 击 
“浏览 ”按钮 ， 打 开 “ 选 择 文 件 ” 对 话 框 ， 选 择 log_class.asp ,“ 传 递 URL 参数 ”选择 记录 
集 Rs 中 的 log ID 字段 ， 其 他 设 定 值 都 不 改变 其 黑 认 值 ， 如 图 8-160 所 示 。 


mmm rm 
传递 URL 参数 :Log TD | 设置 为 以 下 项 的 值 
记录 集 : Rs v| 











列 : |1og ID 交 


传递 现 有 参数 : 口 um 参 数 
口 ] 表单 驮 数 





图 8-160 设置 “ 转 到 详细 页 面 ” 对 话 框 


选中 编辑 页 面 中 的 文字 “修改 ”， 然 后 单 击 “服务 硕 行 为 ”面板 中 的 加 扎 
“+ 二” 投 钮 ， 在 弹出 的 沫 单 中 选择 “ 转 到 详细 页 面 ”选项 ， 打 开 “ 转 到 详细 页 面 ”对 话 框 ， 
单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文件 ”对 话 框 ， 选 择 admin log classupd.asp ，“ 传 递 URL 
参数 ”选择 记录 集 Rs 中 的 log _ID 字段 ， 其 他 设 定 值 彰 不 改变 其 默认 值 ， 如 图 8-161 所 
不 。 
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详细 信息 页 |adnin_ log_classupd_asp ー ] 
传递 URL 参 数 : log m | 设置 为 以 下 项 的 值 
记录 集 : Rs マ 

















列 : 1oe | 
传递 现 有 和 参数 : [ ] umr 参数 
口 ] 表单 参数 





图 8-161 设置 “ 转 到 详细 页 面 ” 对 话 框 
选中 编辑 页 面 中 的 文字 “删除 ” 然后 单 击 “ 服 务 咒 行为 ”面板 中 的 加 二 “十 ” 
按钮 ， 在 弹出 的 荣 单 中 选择 “ 转 到 详细 页 面 ” 选 项 ， 打 开 “ 转 到 话 细 页 面 ” 对 话 框 ， 单 击 
浏览” 按钮， 打开“ 选择 文件 ”对 话 框 ， 选 择 admin log classdel.asp ,;“ 传 递 URL 参数 ” 选 
择 记 录 集 Rs 中 的 log _ID 字段 ， 其 他 设 定 值 都 不 改变 其 默认 值 ， 如 图 8-162 所 示 。 





人: [TE 











设置 为 以 下 项 的 值 
记录 和 集 : Rs y 
列 。 [leg ID 加 
传递 现 有 和 参数: | | mr 参数 
し | 表单 参数 








图 8-162 设置 “ 转 到 详细 页 面 ” 对 话 框 
下 面 将 制作 添加 日 记 列 表 ， 主 要 方法 是 将 页 面 中 的 表单 数据 新 增 到 blog log 数 
据 表 中 ， 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 ( 査 銘 )” 
选项 ， 打 开 “ 记 录 集 ”对 话 框 ， 参 数 设 置 如 网 8-163 所 示 。 























: | connb1og 








< |1og_type 


「 や) 全部 〇 选 定 的 : 














选 : user_username 
阶段 变量 \| [MMM_username 


:无 EE 

















图 8-163” 设 定 Rs2“ 记 录 集 ”对 话 框 
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绑 定 记录 集 后 ， 单 击 “ 分 类 ”的 列表 /菜单 ， 在 分 类 的 “动态 列表 / 麻 蛙 ”属性 面 
板 中 ， 单 击 区 _ 动 达 .| 按钮 ， 打 开 “ 动 态 列表 /菜单 ”对 话 杠 ， 参 数 设 置 如 图 8-164 所 示 。 





来 自 记录 集 的 选项 :| Rs2 








5 |1og_class_TI 





5 |1og class name 











图 8-164 绑 定 动态 列表 
插入 一 个 隐藏 区域， 然后 将 绑 定 面板 中 的 Session 变量 MM username 绑 定 到 
页 面 中 名 为 user username 的 隐藏 域 中 ， 如 图 8-165 所 示 。 


FE 


IN 障 立 区 域 
user_usernar 価 W) = Session("MM_username") %> | 多 





图 8-165 ” 绑 定 字段 到 隐藏 域 中 


在 admm log class.asp 编辑 页 面 中 ， 单 击 “ 应 用 程序 ”和 面板 群 组 中 的 “服务 器 
行为 ”面板 标签 中 的 加 号 “+” 按 钮 。 在 弹出 的 荣 单 列表 中 ， 选 择 “ 插 入 记录 ”选项 ， 在 
“插入 记录 ”对 话 框 中 ， 输 入 如 图 8-166 所 示 的 参数 ， 设 定 新 增 数据 后 转 到 个 人 日 记 管 理 主 


页 面 user admin.asp。 











< [connbloe bal 
插入 到 表格 : |blog_log マ | 
插入 后 ， 转 到 |: user_admin. asp | 
获取 值 自 : | Eorm1 当 [在 提 变 时 ) 
表单 元 素 : oz t と 上 忆捷 人 Si og Ge 
user_ SeLrI 二 er _username (VM) 


og _ class "TD 医大 到 列 | 中 * lo DT ass _ID ( 答 倫 ) 
og cort emt 抽 入 色 | 列 中 “1。 g_cortert" (区 本 ) 





























列 |: [log_title vy 


提交 为 : 文本 vy 














图 8-166 设 定 “插入 记录 ”对 话 框 
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选择 表单 执行 菜单 柱 中 的 “窗口 ”一 “行为 ”命令 ， 打 开 “ 行 为 ”面板 ， 单 击 
“行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 行为 列表 中 ， 选 择 “ 检 查 表单 ”打开 “检查 表 
单 ” 对 话 框 ， 设 置 log title 和 log_content 两 个 文本 域 的 值 都 为 “必需 的 ” 可 接受 “任何 东 
西 ?， 设 置 如 图 8-167 所 示 。 





可 接受 : (任何 东西 〇 数字 
〇 电子 邮件 地 址 〇 数字 人 | | 到 | | 





8-167 设置 “检查 表单 ”对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 完 成 admin log class.asp 页 面 的 设计 ， 完 成 后 
的 效果 如 图 8-168 所 示 。 


守 ni い chap08 い admin_1og_class.asp (GrHTWL) EX 


Hi connblog. asp style.css 


喝 子 二宮 


如 有 果 符 合 此 条 件 则 显示 .. . 
日 记 列 表 管理 : 


”证 
:上 前 无 日 记 , 请 添加 日 记 4 











< > 
<body> <div#top> RI 871 x 517v 276 K / 6 秒 | 简体 中 文 (G6B2312) 


8-168 完成 后 的 admin log class.asp 页 面 的 效果 


修改 日 记 列 表 页 


接 下 来 设计 修改 日 记分 类 的 页 面 admin log classupd.asp， 这 个 页 面 的 主要 功能 是 将 数据 

















博客 系统 


表 中 的 数据 送 到 页 面 的 表单 中 进行 修改 ， 修 改 数据 后 再 更 新 到 数据 表 blog log 中 ， 页 面 设计 
如 图 8-169 所 示 。 


| adnin log classupd. asp 


i connbloe. asp style.css 








Eopyrieght-2bn0-2008 蝎子 记忆 ALL Ri ehts Reserved. 
E-mail: jamboldt2b, com 


<body> <div#top> <divibanner> <div. banner> km 100% v902 x 375v 73 K /11 秒 简体 中 站 (6B2312) 





8-169 ”修改 日 记 内 容 页 面 效果 


制作 步骤 如 下 : 

创建 该 页 面 的 静态 效果 ， 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选 
项 中 ， 选 择 “ 记 录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 再 单 击 “ 局 级 ”按钮 进入 局 级 
模式 徐 口 ， 在 打开 的 “记录 集 ” 对 话 框 中 输入 如 图 8-170 所 示 的 参数 ， 单 击 “ 确 定 ” 控 钮 则 


完成 設定 。 











名 称 : 


: SELECT * 


FROM blog log 
WHERE log ID=Muse And user_username=’ MMuser’ 


型 : WA 


‘request. querystring ("log_. .. 
県 け 計 n 


由 团 表格 


還 店 
类 ”预存 过 和 ーー 


URIER BY 








8-170” 设 定 “ 记 录 和 集 ” 对 话 框 
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语法 说 明 : 


SELECT * 

FROM blog log 

WHERE log ID=Muse And user username=MMuser 

// 根 据 条 件 log ID=Muse And user username='MMuser， 从 blog log 数据 表 中 选择 出 所 有 的 字段 。 


绑 定 记录 后 ， 将 log title 字段 和 log content 字段 插入 到 网 页 的 适当 位 置 ， 如 疼 
8—171 所 示 。 





和 














i ne er ETRE nr nt mn 
= に Pi 1 
= ] 
さて こい ここ て = 
] IRs. lug cort ent 


人 ai 


图 8-171 插入 字段 





再 单 击 “ 绑 定 ” 和 面板 中 的 “+” 号 按钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 《得 
询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 “记录 集 ” 对 话 框 中 输入 如 图 8-172 所 示 的 参数 ， 
再 单 击 “ 确 定 ” 投 钮 则 完成 设 定 。 








| connblog 
|1og type 


「 で ) 全部 し 选 定 的 : 


[ 
| 

yy ,9 < 
li 

| 

| 

| 

| 

外 

L 


:| user userTame 


| 阶段 变量 vw | MN_us Er TAME | 


无 回 Hs 





图 8-172” 设 定 Rs2“ 记 录 集 ”对 话 框 


绑 定 记录 集 后 ， 单 击 “ 分 类 ”的 列表 / 沫 单 ， 在 “分 类” 的 “动态 列表 / 沫 单 ” 
属性 面板 中 ， 单 击 名 动态 .| 按钮 ， 打 开 “ 动 态 列表 /菜单 ”对 话 框 ， 在 打开 的 “动态 列 
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表 / 沫 单 ” 中 设置 如 图 8-173 所 示 。 


动态 列表 /3 溢 单 














来 自 记录 集 的 选项 ， |Rsz 


蛋 : |1og_c1as = TI et | 











; [log class name | 





























: 区 (Rs. Fields. Item (“log class II 到 





图 8-173” 绑 定 动态 列表 


完成 表单 的 布置 后 ， 要 在 admm log classupd.asp 页 面 中 加 入 “服务 硕 行 为 ” 
中 的 “更 新 记录 ” 设 定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 “+” 瑟 按 
钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “ 更 新 记录 ”选项 ， 在 打开 的 “更 新 记录 ”对 话 杠 中， 输入 
参数 如 图 8-174 所 示 。 
























































和 连接: ™ ド 
要 更 新 的 表格 : | 
选取 记录 自 : | Ha 
唯一 键 到 :| 15 ーー | 
在 更 新 后 ， 转 到 : |adnin_log_class. asp 
“区 
表 単 元素 : | 
中 3 Ge Es ig 
textarsa 忠 新 別 "ag content" 


































































































国人 








图 8-174” 设 定 更 狐 记录 





单 击 “确定 ”按钮 回 到 编辑 页 面 则 完成 修改 日 记分 类 页 和 面 的 设计 ， 效 果 如 








图 8—175 所 示 。 


四 D:Achap08sadmir_log_classupdasp (XHTML) 


記入 connblog.asp style.css 


天 于 我 /新 闻 公 告 /我 的 好 点 /最 近 态 客 /最 新 评 做 /后 新 留言 


く 
く body> <div#top> 














设计 删除 日 记 列 表 的 页 面 admin log classdelasp， 该 页面 的 设计 和 修改 日 记 列 表 页 面 差 





不 多 ， 页 面 效果 如 图 8-176 所 示 。 其 方法 是 将 表单 中 的 数据 从 站 点 的 数据 表 中 删除 。 





TD: \chap0s\admin_log_classdel. asp (XHTHL)* 


HR connblog. asp style. css 








关于 我 淖 [ 阁 公告 / 臣 的 好 点 /县 近 访客 /最 新 评论 /最 新 留言 
< 


le 





<body> <divimid> <div. content> <form#forml > 


8-176 删除 日 记 内 容 页 面 效果 








871 x 439v 254 K/ 6 秒 簡体 中 文 GB2312) 时 
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制作 步骤 如 下 ; 
创建 该 页 面 的 静态 效果 ， 然 后 单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 

的 选项 中 ， 选 择 “ 记 录 集 〈 查 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 再 单 击 “ 高 级 ”按钮 进 ー 

入 高 级 模式 窗口 ， 在 打开 的 “记录 集 ” 对 话 框 中 输入 如 图 8-177 所 示 的 参数 ， 单 击 “ 确 定 ” 他) 

按钮 则 完成 设 定 。 に 2 





























「 
[Es| | 
Bl 


EPS Cx) 
: SELECT * ー _ 


FROM bloe las 
WHERE log ID=Muse Arud user username= Miluser’ 









































基数 : 十 | | 一 | 

















| 者 都 : Mase 


|MMaser 


] 眉 :raquest. qerrstring log ... 
默认 值 : 0 
ER 


表格 添加 到 39L: 
四 万 ”视图 [smcr ] 


类 ”预存 过 程 ne 
[mama | 





图 8-177 设 定 “ 记 录 集 ”对 话 框 





绑 定 记录 后 ， 将 log title 字段 和 log_content 字段 插入 到 网 页 的 适当 位 置 ， 如 
8-178 所 示 。 


归队 日 记 
ds 
rE 
标题 : ] Rs. ng titl 
・ SS. lng title 
RAR ns 
| we 
rna 1 
eR A ot PTI 
Es. lng content} | 





图 8-178 插入 字段 


再 单 击 “ 绑 定 ”面板 中 的 加 号“+” 按 钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 





( 合 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 “记录 集 ” 对 话 框 中 输入 如 图 8-179 所 示 的 参 
数 ， 再 单 击 “确定 ”按钮 则 完成 设 定 。 








名 称 : 瑞 
连接 : | connb1og 
表格 : og:type 


列 : @@ 全 部 〇 选 定 的 : 
































簿 选 : | user_username v = 
| 阶段 变量 | lusernane 
排序 : 无 vy 升序 























图 8-1759 设 定 Rs2“ 记 录 集 ”对 话 框 


绑 定 记录 集 后 ， 单 击 “ 分 类 ”的 列表 / 沫 单 ， 在 “分 类” 的 “动态 列表 / 沫 单 ” 
属性 面板 中 ， 单 击 区 。 _ 动 达 .按钮 打开“ 动态 列表 /菜单 ”对 话 框 ， 在 打开 的 “动态 列表 / 
菜单 ”中 设置 如 图 8-180 所 示 。 


动态 列表 7 党 单 








来 自 记录 集 的 选项 : | 








2 1 og _ class TI 








: log class name マ | 








: [GE GRs.Tie1ds.Ttem("1og clsss TI 他 








圏 8-180 绑 定 动态 列表 


完成 表单 的 布 阐 后 ， 要 在 admin log _ classdelasp 页 面 中 加 入 “服务 磺 行 为 ”中 
的 “更 新 记录 ”议定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 
钮 。 在 弹出 的 荣 单 列表 中 ， 选 择 “删除 记录 ”选项 ， 在 打开 的 “删除 记录 ”对 话 框 中 ， 输 入 
参数 值 如 图 8-181 所 示 。 














演 接 . [EEC | 
从 表格 中 删除 : blog 1cg | 
选取 记录 自 : Rs 











唯一 键 列 : 1og_ID 
提交 此 表单 以 删除 : | fm 
删除 后 ， 转 到 : |adnin_loe_class. asp 











图 8-181 设 定 “删除 记录 ”对 话 框 














单 击 “ 硝 定 ”按钮 回 到 编辑 页 面 则 完成 删除 日 记分 类 页 面 的 设计 ， 效 末 如 
图 8-182 所 示 。 


中 | D:Acehap08admimr_ log _ classdel.asp (XHTML) = x 


A connblog. asp style. css 


蝎子 博客 





关于 我 /新 闻 公 省 /我 的 好 友 / 最 近 访 客 /最 新 评论 /最 新 留言 


图 | | > 
<body> <div#top> 259 Kf 6 秒 筒 体 中 文 GB2312)  : 








8-182 admin log classdel.asp 页 面 的 设计 效果 


: 管 時 放 博客 分 类 党 理 页 面 


博客 分 类 管理 页 面 admin blog type.asp 是 管理 员 admin 通过 前 人 台 登 录 后 ， 进 入 的 一 
个 党 理 页 面 。 主 要 功能 是 对 博客 分 类 进行 修改 、 删 除 和 添加 操作 。 页 面 的 设计 效果 如 图 
8-183 所 示 。 





局 D:vehap0svadnin_ blog_trpe.asp (KHTML)* - x 


PR connblog. ssp style. css 


喝 プ 二宮 


添加 博客 分 类 : 


捕 客 分 类 名 称 : 








Me 
8 博客 分 类 名 称 : 理 
: Em | 、 BB 
rn 


mn 
: 修改 ”删除 : 
> 
* ホホ 
PP TT 


Ca 
に 
> 


关于 我 /新 闻 公 告 /我 的 好 友 / 最 近 访 客 /最 新 评论 /最 新 留言 


© > 
< も ody> Cdivimid> <div. content> IgG 871 x 439v 256 K / 6 秒 簡体 中 文 (GB2312) . 








8-183 ”博客 分 类 管理 页 面 效 果 图 


制作 步骤 如 下 : 
在 admin blog type.asp 页 面 中 表单 froml 中 的 文本 域 和 文本 区 域 的 设置 见 
表 8-4。 
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表 8-4 表单 ffom1 中 的 文本 域 和 文本 区 域 设置 


意 义 文 本 (区 ) 域 /按钮 名 称 


添加 博客 分 类 typename 单行 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 
中 输入 如 图 8-184 所 示 的 参数 。 

单 击 “确定 ”按钮 ， 完 成 记录 和 集 Rs 的 绑 定 ， 把 绑 定 的 Rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-185 所 示 。 


凌 








名 称 : 国 
连接 : | connblog 
表格 : blog_type 


列 : @ 全 部 〇 选 定 的 : 








ご に 。 
Pe 
址 客 另类 略称 : ] 1 
1 hr 
IE ] 四 
か 
で で で で で で で で で で で で で て で で で で て て て で で で て て て で で て も いい いも て て て いい てい tt 
担 客 号 到 | 表 ・ 
に a 
和 Le 
和 円 
3 3 に ーー 
= 中 5 已 - 
和 円 
了 
和 円 
Rs. typename : < 
・ 四 En “4 
ーー 
下 \ 
ク 1 
ビラ = S と E ル 
二 に 








由 于 admm blog type.asp 页 面 要 显示 数据 表 blog type 中 的 所 有 记录 ， 而 目前 
的 设 定 只 能 显示 数据 库 的 第 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 
定 ， 单 击 admin blog type.asp 页 面 中 要 重复 的 表格 ， 如 图 8-186 所 示 。 

















{Rs. tyEeramel 





图 8-186 选择 需要 重复 的 表格 








单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 加 号 
“+ ”按钮 。 在 弹出 的 菜 音 中， 选择“ 重复 区 域 ” 选 项 ， 打 开 “ 重 复 区 域 ” 对 话 框 ， 在 “ 重 
复 区 域 ” 对 话 框 中 ， 设 定 一 页 显示 的 数据 记录 为 “所 有 记录 ” 如 8-187 所 示 。 

单 击 “确定 ”按钮 回 到 编辑 页 面 ， 将 
发 现 乙 前 选中 要 重复 的 区 域 的 左上 角 出 现 了 一 个 
“重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

单 击 “ 应 用 程序 ”面板 中 的 “服务 需 
行为 ”标签 中 的 “+” 号 按钮 。 在 弹出 的 玉音 列表 
中 ， 选 择 “ 插 入 记录 ”选项 ， 在 “搬入 记录 ”对 话 
框 中 ， 输 入 如 图 8-188 所 示 的 参 数 , 設定 新 増 数 据 
后 转 到 个 人 日 记 管 理 主页 面 admm log type.asp。 图 8-187 选择 记录 集 的 显示 数量 
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插入 到 表格 : (blog_type 
插入 后 ， 转 到 |: /adnin_b1og_type. asp 














获取 值 自 : | Eorm1 ーー 
表单 元 素 : | tpanane 插 入 到 elLaMe” 

















图 8-188 ” 设 定 “插入 记录 ”对 话 框 
单 击 “确定 ”按钮 完成 记录 的 插入 ， 选 择 表 单 执行 沫 单 栏 中 的 “窗口 ”一 “ 行 
为 ”命令 ， 打 开 “ 行 为 ”面板 ， 单 击 “ 行 为 ”面板 中 的 加 号 “+” 按 钮 ， 在 打开 的 行为 列表 
中 ， 选 择 “ 检 查 表 单打 开 “ 检 查 表 和 单 ” 对 话 杠 ， 设 置 typename 文本 域 的 值 都 为 “必需 
的 ”， 可 接受 “任何 东西 ”设置 如 图 8-189 所 示 。 




















值 : 必需 的 


可 接受 : (や 任 何 未 丁 〇 数字 
C 〇 电子 邮件 地 址 ”C 〇 ”数字 从 





图 8-189 设置 “检查 表单 ”对 话 框 


编辑 页 面 中 的 文字 “修改 ”和 “删除 ”的 连接 必须 要 传递 参数 给 前 往 的 页 面 ， 
这 样 前 往 的 页 面 才 能 够 根据 参数 值 从 数据 库 中 和 莽 选 出 茶 一 条 记录 进行 编辑 。 选 中 编辑 页 和 面 中 
的 文字 “修改 ” 单 击 “ 服 务 器 行为 ”面板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 菜单 中 选择 “ 转 到 
详细 页 面 ” 选项 ， 在 打开 “ 转 到 详细 页 面 ” 对 话 框 中 ， 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文 
件 ” 对 话 框 ， 选 择 /admin blog upd.asp,“ 传 递 URL 参数 ”选择 记录 集 Rs 中 的 type ID 字 
段 ， 其 他 设 定 值 都 不 改变 其 默认 值 ， 如 图 8-190 所 示 。 














详细 信息 页 : |/sdmin_b1og upd asp | 
传递 URL 参数 : [typeID O ] 设置 为 以 下 项 的 值 


记录 集 :|Rs vy 

















列 : |type_ID ww | 





传递 现 有 戎 数 : [] ur 参数 
[表单 参数 





图 8-190 设置 “ 转 到 详细 页 面 ” 对 话 框 









二 デ 」 
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选中 文字 “删除 ”并 重复 上 面 的 操作 ， 将 要 转 到 的 页 面 改 为 /admin blog_ 
delasp， 如 图 8-191 所 示 。 


转 到 证 细 页 面 


链接 : | 轩 山 访 潮 wv 
详细 信息 页 
传递 UEL 参 数 : 设置 为 以 下 项 的 值 
记录 入 
列 : | type_ID マ 
传递 现 有 参数 : [| ] mr 参数 
し | 表单 参数 








8-191 设置 “ 转 到 详细 页 面 ” 对 话 框 


单 击 “确定 ” 投 钮 ， 完 成 博客 分 类 管理 页 徊 admin_blog type.asp 的 制作 , 完成 
后 的 效 采 如 图 8-192 所 示 。 


守 D: vechap08vadmin blog_type.asp CKHTML) al 





Hi connblog. asp style. css 


蝎子 博 吕 


添加 博客 分 类 : 





:修改 删除 | 


关于 我 /新 闻 公告 /我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 久 Fomyriekt 2000-2008 蝎子 记忆 ALl Rights Reserve 


E-mail: 1ambo@126. com 
< 
<body> <div#top> 





8-192 admin blog type.asp 页 面 效 果 


4 


30 修改 博客 分 类 页 面 


接 下 来 要 设计 修改 博客 分 类 的 页 面 admm blog upd.asp， 这 个 页 面 主要 是 将 数据 表 中 的 
数据 传送 到 页 面 的 表单 中 进行 修改 ， 修 改 数 据 后 再 更 独到 数据 表 blog type 中 ， 页 和 面 设计 如 





图 8-193。 
操作 步骤 如 下 : 








在 admm blog upd.asp 页 面 中 表单 foml 中 的 文本 域 和 文本 区 域 的 设置 见 表 8-5。 














ED: \chap0s\admin blog_upd. asp CKHIML)* 


PR connblog. asp style. css 





yright 2000-2008 蝎子 记忆 并 1 Ri ehts Reserve 
E-mail: 1amboB126. com 


关于 我 /新 闻 公 党/ 我 的 好 友 / 最 近 访 客 / 最 新 评论 /最 新 留言 
BT1 x 439v 25BK/B 秒 筒 体 中 文 (GB2312) 


る | 而 
く body> <divimid> <div. content> <form#forml > <table> <tr> <td>Kinput#typename】 |W | 
8-193 ”修改 博客 分 类 页 面 效果 图 








表 8-5 表单 ffom1 中 的 文本 域 和 文本 区 域 设 置 


文 本 (区 ) 域 /按钮 名 称 
单行 


修改 博客 分 类 typename 
单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 和 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 和 集 ”对 话 框 
中 输入 如 图 8-194 示 的 参数 。 
名 称 : 国 ws 
表格 noewe 上 加 


列 : @ 全 部 〇 选 定 的 : 


排序 天 序 





8-194 ” 绑 定 记录 和 集 s 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 rs 的 绑 定 ， 把 绑 定 的 rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-195 所 示 。 


8-19$ ”插入 字段 
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完成 表单 的 布 阐 后 ， 要 在 admin blog upd.asp 页 面 中 加 入 “服务 器 行 为 ”中 的 
“更 新 记录 ” 设 定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 喜 行 为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 更 狐 记 录 ” 选 项 ， 在 打开 的 “更 狐 记 录 ” 对 话 杠 中， 输入 参数 值 
的 如 图 8-196 所 示 。 

















要 更 新 的 表格 : ee 

选取 记录 自 zs ~ 

唯一 键 列 ; 中 数值 
在 更 新 后 ， 转 到 |: 


获取 值 自 ; 寿 提 六 时 ) 


ee 
| 








8-196 ” 设 定 “更 独 记 录 ” 对 话 框 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 完 成 修改 博客 分 类 页 面 的 设计 ， 如 图 8-197 
所 示 。 


TD: \chap03\admin_blog_upd. asp (XHTML) PE 











く 
<body> <div#top> 


8-197 admin blog upd.asp 页 面 效果 


:于 下 删除 博客 分 类 页 面 


设计 删除 博客 分 类 的 页 面 admin blog del.asp， 该 页 面 的 设计 和 删除 日 记 列 表 页 面 差 
不 多 ， 页 面 效果 如 图 8-198 所 示 。 其 方法 是 将 表单 中 的 数据 从 站 点 的 blog type 数据 表 中 
删除 。 























ED: \chapos\admin blog_del. asp (XHTNL)* 


PR connblog. asp style. css 





E-mail: 1ambo@12 


关于 我 /新 闻 公 告 /我 的 好 皮 / 最 近 访客 /最 新 评论 /最 新 留言 Copyright 2000 og Reseryed 
< | 川 | > 
odw> Cdiv... > Xdiv... > Xform... > く tab1e> く tr> <td> 1abel> く input#tvpename | IS2 KR 100%X v871 x 439v| 255K ア BE 秒 筒 体 中 文 (GB2312)  .: 








8-198 删除 页 面 的 设计 


操作 步骤 如 下 : 
在 admin_blog_ delasp 负面 中 表 香 foml 中 的 文本 域 和 文本 区 域 的 设置 匈 表 8-6。 





表 8-6 表单 ffom1 中 的 文本 域 和 文本 区 域 设置 


意 义 文 本 (区 ) 域 /按钮 名 称 类 型 


单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 和 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 和 集 ” 对 话 框 
中 输入 如 图 8-199 所 示 的 参 数 。 


名 称 国 | 
表格 
列 : ぐ 全部 Q 〇 选 定 的 ; 


二 到 





8-199 绑 定 记录 集 rs 


单 击 “确定 ”按钮 ， 完 成 记录 集 rs 的 绑 定 ， 把 绑 定 的 rs 中 的 字段 插入 到 网 页 





2 


ンズ 
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的 适当 位 置 ， 如 图 8-200 所 示 。 


に 
册 | 际 博客 部 闪 : 
a も も も も エキ も モエ ミキ モエ モモ エキ モエ て モモ エキ モモ エミ モモ ミエ も キモ エミ も モミ エモ モモ も モモ エモ モエ も キモ エモ エモ モエ エモ エモ エミ モモ もそ モモ モエ も モミ エモ も モモコ 
:博客 部 兴 镍 称 : :| rg.+ymemamgl 。 _| | 删除 
ロ 画 
: | {ra.twypernamel} 十 
和 PPE 


图 8-200 ”插入 字段 


完成 表单 的 布置 后 ， 要 在 admin blog delasp 页 面 中 加 入 “服务 器 行为 ”中 的 
“删除 记录 ” 设 定 ， 单 击 “ 应 用 程序 ”面板 中 的 “服务 器 行为 ”标签 中 的 加 号 “+” 按 钮 。 在 
弹出 的 菜单 列表 中 ， 选 择 “ 删 除 记录 ”选项 ， 在 打开 的 “删除 记录 ”对 话 框 中 ， 输 入 参数 什 
如 图 8-201 所 示 。 

















连接 : | 








w | 
| 


选取 记录 自 : rs ~ 








唯一 键 列 : | type_ID v| 較 数值 
提 变 此 表单 以 删除 :| forml | 
册 除 后， 转 到 : /adnin_blos_type. asp 





图 8-201 设 定 “删除 记录 ”对 话 框 


当 管 理 员 单 击 “删除 ”按钮 时 可 将 博客 分 类 进行 删除 ， 但 为 了 慎重 起 见 ， 
有 必要 提示 管理 员 是 否 确定 要 删除 这 个 博客 分 类 ， 单 击 选择 “删除 ”按钮 ， 再 单 击 “ 显 
不 代码 视 图 ”按钮 加 人 进入 代码 视 口 ， 将 “删除 ”按钮 中 的 <inpu 全 中 的 代码 修改 
为 如 下 内 容 : 

<input name="Submit" type="submit" onclick="GP popupConfirmMsg(' 人 确定 删除 吗 ?");return 
document.MM returnValue" value=" 删 除 " /> 

/ 当 单 击 “ 确 定 ” 投 钮 时 弹出 一 个 新 的 窗口 ， 提 示 “ 确 定 删除 吗 ? ” 

测试 效果 如 图 8-202 所 示 。 























| EW lnternet Ezplorer 区 | 


、 ジ 确定 册 除 吗 ” 





图 8-202 弹出 的 提示 窗口 效果 





完成 后 的 admin blog delasp 页 面 效果 如 图 8-203 所 示 。 




















效果 如 图 8-204 所 示 。 


ED: \chap08\admin blog. asp (KHTML)* 


HTN connblog. asp style. css 
蝎子 二 器 


: 用 户 博客 信息 : 


关于 我/ 世间 公告/ 我 的 好 友 / 量 近 沪 客 / 量 新 证 论 /是 新 外 言 Friav 2mtr toe 昌子 AH Riehts here 
< | 中 
8-203 ”完成 后 的 admin blog delLasp 页 面 效果 
8.4.12 
博客 列表 管理 页 面 admin blog.asp 用 于 显示 所 有 用 户 博 客 列 表 ， 并 通过 该 页 面 可 以 链接 
到 是 否 推荐 页 面 admin blog good.asp 和 删除 用 户 博 客 页 面 admin del blog.asp， 页 面 的 设计 
_nx 


> 


871 x 439v 260 K / 6 秒 | 简体 中 文 (GB2312) | 


天 于 我 /新 闻 公告 /我 的 好 点 /县 近 访 客 /最 新 评论 /最新 留言 
LR 


图 8-204 ”博客 列表 管理 页 面 的 效果 图 








详细 制作 步骤 如 下 : 
打开 “记录 集 ” 对 话 框 再 单 击 “ 局 级 ”按钮 进入 噩 级 模式 窗口 ， 在 打开 


单 击 “ 绑 定 ” 面 板 中 的 加 号 “+” 按 钮 ， 在 弹出 的 选项 中 ， 选 择 “ 记 录 集 
“记录 集 ” 对 话 框 中 输入 如 图 8-205 所 示 的 参数 ， 单 击 “ 确 定 ”按钮 后 则 完成 设 定 。 


( 伍 询 )” 选 项 





Es| | 
: | cormub]og ~ 














es 六 


FROM wu 
DRDER BY u user_ blog good DESC, nssr TI DESC 





: は | 











: 七 ”表格 添加 到 SL: 


四 内 视图 し し srcr 」 
現存 党 程 ーーー 


UERTER BY 








8-203 ” 设 定 “记录 和 集 ” 对 话 框 


绑 定 记录 后 ， 将 绑 定 的 字段 插入 到 网 页 的 适当 位 置 ， 如 图 8-206 所 示 。 





CENTREPIECE rr TR rr nr errr er for err orr] 
用 戸 汰 : 博客 分 类 博客 名 日 记 笋 是 盏 推荐 编辑 

二 
站 FL を を モモ トト キモ トキ キモ トモ キモ モモ モモ モモ モモ モモ Dn 
: {Rs. user username}: {Rs. typename}: {Rs. user blog name}: {Rs. user post mm}: vo 册 | 险 


eT NT SDS ART nd RT ERR 区 も も L も も も も も も も も 


8-206 ”插入 字段 


选择 页 面 中 “是 否 推荐 ”单元 格 下 方 的 两 个 小 图 标 ， 在 属性 面板 中 设置 它们 的 
“ 蔡 换 ” 值 分 别 为 “取消 推荐 ?” 和 “ 设 为 推荐 ?”， 如 图 8-207 所 示 。 


品 尾 








図像 , 1K 喜 16 源 娘 件 ) [mages/icon pass. gif 3 蔡 换 立 ) 取消 推荐 ? に 2 类 [C) 无 wv 
DG)| |) 高 8 链接 已 ) | 3 编 拖 回 まず 




















地 图 几 [] 委 直 浪 距 OO] 。 目标) 聞 給 計る A 
| ロロ ホモ 乏 距 原始 Gy 对齐 的 | 默认 值 v | 
無人 性 











図像 , 1K 喜 16 源 亡 件 (S) limages/icon del. gif 等 已 苦 换 全 】 设 为 推荐 3? wv 美 (C) 无 wv 
の [| | 高 i5 | 好 0 ob 全 回 ずっ 














地図 OW) 委 直 边 距 ⑩ 目标 他 边框 @) EE 合生 A 
kK| ロロ OM 水 平 边 距 外 ) 原始 | ya 对 六 多 | 默认 值 v 


8-207 ”设置 奉 换 值 


再 选择 页 面 中 “是 售 推 荐 ”单元 格 下 方 的 两 个 小 图 标 ， 切 换 到 代码 窗口 ， 加 入 
相应 代码 如 下 : 





<% if( Rs.Fields.Item( "user blog good").value)=1 1hen %> 


<img src="images/icon pass.gif' alt=" 取 消 推荐 ? "width="16" height="16" border="0" /> 
<%Else%> 
<img src="images/icon_del.gif" alt=" 设 为 推荐 ? " width="16" height="16" border="0" /> 


<% End ifV6% テ > 
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语法 说 明 : 

如 果 记 录 集 中 user blog good 字段 的 值 等 于 1， 则 显示 icon pass.gif, 如果 不 等 十 1 则 
显示 icon delL.gif。 _ 

由 于 admm blog.asp 页 面 应 显示 所 有 用 户 博客 的 信息 记录 ， 而 目前 的 设 定 只 能 OO) 
显示 数据 库 的 第 一 条 记录 ， 因 此 ， 需 要 加 入 “服务 器 行为 ”中 的 “重复 区 域 ” 设 定 ， 单 击 和 
admin log class.asp 页 而 中 的 要 和 曹 复 显示 的 表格 ， 如 图 8-208 所 示 。 


{Rs. user usernamelh {Rs. trpenamei {Rs. user blog nameiB {Rs. user pnst mim} jE : | 册 | 隆 





























图 8-208 选择 要 重复 的 记录 集 表 格 


单 击 “ 应 用 程序 ”面板 群 组 中 的 “服务 器 行为 ”面板 ， 并 在 面板 中 单 击 “+” 
号 按钮 。 在 弹出 的 菜单 中 ， 选 择 “ 重 复 区 域 ”选项 ， 打 开 “ 重 复 区 域 ”对 话 框 ， 在 “重复 区 
域 ”对 话 框 中 ， 设 定 一 页 显示 的 数据 记录 数 为 20， 如 图 8-209 所 示 。 











显示 (po | 记录 


C 〇 ) 所 有 记录 








图 8-209 选择 要 重复 显示 和 记录 数 


单 击 “ 确 定 ” 按 钮 回 到 编辑 页 面 ， 将 发 现 之 前 选中 要 重复 的 区 域 的 左上 角 出 现 
了 一 个 “重复 ”的 灰色 标签 ， 这 表示 已 经 完成 设 定 。 

接 下 来 要 在 admin blog.asp 页 面 中 加 入 “记录 集 导 航 条 ” 用 来 分 页 显示 博客 
列表 数据 ， 把 鼠标 移 至 要 加 入 “记录 集 导航 条 ”的 位 置 ， 单 击 “ 插 入 ”工具 栏 中 的 “数据 ?” 
标签 中 的 “记录 集 寻 航 条 ”按钮 恕 |， 在 打开 的 “记录 和 集 导 航 条 ”对 话 杠 中， 选中 要 导航 的 
记录 集 以 及 导航 的 显示 方式 ， 然 后 单 击 “ 人 确定” 按钮 回 到 编辑 页 面 ， 此 时 页 面 束 会 出 现 该 记 
录 集 的 导航 条 ， 如 图 8-210 所 示 。 
































记录 和 集 叶 舱 条 








0 案 笠 志 站 各 音符 车 外 :各 第 符 全 弛 条 件 吉 果 符合 由 
: : 


ee 要 后 一 页 | 


图 8-210 ”加 入 “记录 集 导 航 条 ” 


第 -页 | 





2 


2 


5 
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选中 编辑 页 面 中 “是 否 推荐 ”下 方 的 所 有 ASP 代码 和 小 图 标 ， 单 击 “ 服 务 吉 
行为 ”面板 中 的 加 和 写 “+” 按 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详细 负面” 选项， 打开 “ 转 到 
详细 页 面 ” 对 话 框 ， 单 击 “ 浏 览 ” 按 钮 ， 打 开 “ 选 择 文 件 ” 对 话 杠 ， 选 择 admin blog_ 
good.asp,“ 传 递 URL 参数 ”选择 记录 集 Rs 中 的 user ID 字段 ， 其 他 参数 值 都 不 改变 其 默认 
值 ， 如 图 8-211 所 示 。 


转 到 古 细 夏 面 


























传递 UET 矢 数 : user_ID | 借 于 六 以 下 项 的 值 











| 
传习 现 有 釜 数 : | | jr 参数 
| | 表单 参数 





图 8-211 设置 “ 转 到 详细 页 面 ”对 话 框 


同样 选中 编辑 负面 中 的 文学 “删除 ”再 单 击 “服务 占 行 为 ”面板 中 的 加 号 
“+” 控 钮 ， 在 弹出 的 采 单 中 选择 “ 转 到 详细 页 和 面 ”选项 ， 打 开 “ 转 到 评 细 页 面 ” 对 话 
框 ， 单 击 “ 浏 览 ” 按 钮 ， 打开 “选择 文件 ”对 话 框 ， 选 择 admin del blog.asp, “传递 
URL 参数 ”选择 记录 集 Rs 中 的 user _ID 子 段 ， 其 他 参数 值 虱 不 改变 其 默认 值 ， 如 图 8-212 
所 示 。 


壬 到 庄 细 责 面 


链接 :| 国 UU 
详细 信息 页 


属 通 UEL 僚 数 : TI 
































传递 现 有 参数 : | ] umr 参 数 
| ] 表单 参数 





图 8-212 设置 “ 转 到 详细 页 面 ” 对 话 框 





单 击 “ 确 定 ” 按 钮 ， 则 完成 博客 列表 管理 页 面 admin_blog.asp 的 设计 和 制作 ， 
如 图 8-213 所 示 。 





如 果 符 合 遇 如 果 符合 此 :如 果 符 合 此 条 件 如 果 符合 此 条 件 则 显示 . 


关于 我 中 [ 间 公 告 /我 的 好 点 /县 近 态 客 / 旦 新 评论/ 县 新 鲁 言 


く 
く body> <div#top> 














8-213 ”admin blog.asp 的 设计 效果 





:二 推荐 博客 的 管理 页 面 


推荐 博客 的 管理 页 面 admin blog good.asp 是 根据 users 数据 表 中 的 user blog good 字段 来 确 
定 是 人 否 是 推荐 的 用 户 博 客 ， 所 以 制作 方法 驶 是 更 新 users 数据 表 中 的 user blog good 字段 ， 
user blog good 字段 值 为 1 时 为 推荐 博客 ， 为 0 时 不 是 推荐 博客 。 页 面 设计 效果 如 图 8-214 所 示 。 


守 : n: い chap08Vadmin_blog_good asp CXHTML)* 本 | 








HR connblog. asp style. css 〒 
内 


蝎子 博 吕 


设置 博客 是 否 为 推荐 : 


:OO 接 信 Ti 基 i] : 


Ss 


关于 我 /新 闻 公 洁 / 我 的 好 点 /最 近 仿 客 / 最 新 评 伦 / 最 新 留言 


图 TT | 9 
body> <divimid> <div. content> <form#forml > <table> <tr> <td> Tabe1>Gnpnt| [km 871 x 439y 258K ア B 秒 简体 中 女 (68B2312)  ，; 








图 8-214 推荐 用 户 博 客 管理 页 面 设计 效果 


制作 步骤 如 下 : 
创建 admin blog good.asp 的 静态 页 面 ， 加 入 两 个 单 选 按钮 ， 其 名 称 都 为 
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user_blog_good， 其 中 推 存单 选 按钮 值 为 1， 不 推荐 按钮 值 为 0,“ 属 性 ”面板 设置 如 网 8-215 
所 示 。 





























RE 

の | 选 定 值 1 ] 阅 始 状 硒 已 加 选 亿 ) 类 (无 v| 
nser_blog_ec 7 __ 动态 直选 中 QU 

ttE 

加 | > 先 定 值 0 机关 状 基 站 已 网 授 避 类 @) | 无 司 
ser_L1og gr 7 动态 ... 求 选中 加) 





图 8-215 ”创建 单 选 按 钮 并 设置 其 属性 


单 击 “应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 〈 奉 询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 
中 输入 如 图 8-216 所 示 的 参 数 。 





名 称 : 国 | 
和 连接 : | cormblog v| 
表格 : users yl 


列 号 全部 人 选 定 的 : 


端 延 : user_ID yl = 
Es 
EL 酸 剖 vY| Inser_1H 


排序 : | 无 网上 升序 








图 8-216 ” 绑 定 记录 集 Rs 


单 击 “ 人 确定” 按钮 ， 完 成 记录 集 Rs 的 绑 定 ， 把 绑 定 的 Rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-217 所 示 。 


a 


= 
も も も セト モモ セミ モモ モト モモ モモ て エセ モモ モモ て モ モモ モモ モモ モモ トト セミ エエ セト エモ ミキ て エセ エエ エト エセ ミミ て キ セキ エセ モモ セ モ モモ トモ モミ モモ エモ エモ て モモ モモ エモ セコ 


{Rs. ser_usernamel :O 推荐 《不 推荐 : 


二 


图 8-217 插入 字段 


选择 “是 否 推荐 ”单元 格 下 方 的 任 一 个 单 选 按钮 ， 在 属性 面板 中 单 击 “ 绑 定 动 
态 源 ”按钮 区 动 查 .. |， 打开 “动态 单 选 按钮 ”对 话 框 ， 在 打开 的 “动态 单 选 按钮 ”对 话 
框 中 设置 “选取 值 等 于 ”为 “Rs” 记 录 集 中 的 user blog good 字段 ， 即 等 于 <%= 
(Rs.Fields.Item("user blog good").Value) %>， 如 图 8-218 所 示 。 














博客 系统 


单 选 校 钮 姐 :aser b1。g good" 在 FORM “forr 


人 


Er 
和信 





图 8-218 ”设置 动态 单 选 按钮 
单 击 “ 人 确定” 按钮 ， 完 成 对 动态 数据 的 绑 定 ， 再 单 击 “应 用 程序 ”面板 中 的 
“服务 占 行 为 ”标签 中 的 加 号 “+” 按 钮 。 在 弹出 的 亲 单 列表 中 ， 选 择 “ 更 狐 记录 ”选项 ， 在 
打开 的 “更 狐 记 录 ” 对 话 框 中 ， 输 入 参数 值 如 图 8-219 所 示 。 





要 更 新 的 表格 :|users ~» pm 


选 职 记 录 自 : Rs wv 


唯 二 键 列 : | user_ID x | 数值 
在 更 新 后 ， 转 到 : admin blog asp ーー Er 


获取 值 自 : 任 提 交 时 ) 
团 |ussr blog good 昌 新 列 | "user b1og good" (数 直 ] 








到 








图 8-219 设 定 更 新 记录 
单 击 “ 确 定 ” 按 钮 ， 回 到 编辑 页 面 则 完成 推荐 博客 
果 如 图 8-220 所 示 。 


Dn: \chap0s\admin blog_good asp (XHTML) 








く 
<body><diy##top> 


8-220 admin blog good.asp 的 页 面 效 果 









一 和 
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二 旧 删除 用 尸 博 客 页 面 


最 后 设计 删除 用 户 博 客 的 页 面 admin del blog.asp， 其 方法 是 将 表单 中 的 数据 从 站 点 的 
数据 表 users 中 删除 ， 页 面 的 设计 效果 如 图 8-221 所 示 。 


| n: い chap08Vadmin_de1_blog.ssp (XHTNL)* _ 口 x 











HE connblog. asp style. css 


蝎子 博 品 


:确定 要 扣除 此 用 P3 =。 
時 


. Te ne rE っ ， See Vda ， yf PN っ ー ゥ 8 4 ゴア ュ を の 
关于 我 /新 闻 公告 /我 的 好 友 / 最 近 访客 /最 新 评论 /最 新 留言 Copyright 2000-2008 蝎子 记忆 Nl Rights Reserved 
E-maill: ]ambold1ZD. com 


< 山 | 岗 
<body> Cdivimid> <div. content> <form#forml > <table> <tr> <td>(<div】 871 x 439v 256 X 7 6 秒 简体 中 文 (582312)  .: 








8-221 删除 用 户 博 客 的 页 面 设计 效 打 


制作 步骤 如 下 : 

单 击 “ 应 用 程序 ”面板 中 的 “ 绑 定 ”标签 中 的 加 号 “+” 按 钮 ， 在 打开 的 列表 
菜单 中 选择 “记录 集 (查询 )” 选 项 ， 打 开 “ 记 录 集 ”对 话 框 ， 在 打开 的 “记录 集 ” 对 话 框 
中 输入 如 图 8-222 所 示 的 参数 。 


名 称 : 
表格 : 
OO 


ser Tl 
typename 


Ser USername 
m5eT- _ password 

E 
user hlng name | 


持 序 | 无 ” 圈 | 天 





8-222” 绑 定 记 录 集 Rs 


单 击 “ 确 定 ” 按 钮 ， 完 成 记录 集 Rs 的 绑 定 ， 把 绑 定 的 Rs 中 的 字段 插入 到 网 页 
的 适当 位 置 ， 如 图 8-223 所 示 。 











博客 系统 





确定 雪山 际 此 用 户 3 


人 


a 
EL 
bp に 


{Rs. user username} : {Rs.user blng namej : | 删除 | 


ニャ ーー ニー ニー ニー ニーーー ニ ーーー ニ ーー ーー ニーーー ニ ーー 





8-223 ”插入 字段 











完成 表 早 的 布置 后 ， 要 在 admin del blog.asp 页 面 中 加 入 “服务 大 行为 ”中 的 
“删除 记录 ” 设 定 ， 在 admin del blog.asp 页 面 中 ， 单 击 “应 用 程序 ”面板 中 的 “服务 融 行 
为 ”标签 中 的 加 号 “+” 投 钮 。 在 弹出 的 菜单 列表 中 ， 选 择 “删除 记录 ”选项 ， 在 打开 的 
“删除 记录 ”对 话 框 中 ， 输 入 参数 值 如 网 8-224 所 示 。 








连接 : 
从 表格 中 出 除 : 
选 职 记录 自 : Rs マ 
唯一 键 列 : 数值 


提交 此 表单 以 删除 :| forml 関 
删除 后 ， 转 到 |: 浏览 








色 8-224 ” 设 定 “删除 记录 ”对 话 框 


单 击 “ 确 定 ” 按 钮 ， 回 到 编辑 页 面 则 完成 删除 用 户 博 客 页 面 的 设计 ， 效 来 如 
图 8-223 所 示 。 


局 Di:vehap0svadnin_del_bloe. asp (KHTML) ll 


ia connblog. asp style.css 


蝎子 博客 


: ”确定 要 删除 此 用 户 ? 


ex 
~ 


Se な ER 
3 : 
s. user_username} : {Rs.user blog name}  : 
ON 


关于 我 /新 闻 公 告 /我 的 好 点 /最 近 访 客 / 最 新 评论 /最 新 留言 





< 
<body> <div#top> 





8-225 admin del blog.asp 的 设计 效果 


全 此 ， 博 铬 系统 的 前 台 与 后 台 的 开发 工作 束 已 经 完成 。 

















] 9 ロロ nHHh 


网 上 开店 以 成 本 低 、 启 动 资金 少 、 交 易 








专业 网 千 平 机 粮 秋 机 枸 
Bah mibiis Eh 








快捷 等 优势 得 到 许多 创业 者 的 青 脉 。 许多 用 车 | で 
户 通过 在 网 上 开店 获得 了 丰厚 的 回报 ， 因 此 二 ea 


在 目前 的 网 络 应 用 中 ， 网 上 购物 系统 已 成 为 本 人 和 EME TR EL 
"WP 加 于 礼 上 网 2011 生 市 珊 村 让 
技术 的 热点 。 一 个 购物 系统 必须 拥有 会 员 系 。 直上 e の ee 8 加 | 上 
请 空 网 贡 在 1 去 掉 算 回 昌 活 折 還 っ 0 
统 、 查 询 系统 、 购 物流 程 、 会 员 服 务 、 后 台  。。。。 四 raat 





誠一 El ] RE 
管理 等 功能 模块 。 * 
[经 |] xi : 
二 守 本 寺 』 目 
ュー デー ET L 


国 严 乎 术 菅 配 平 料 ” 旋 痢 平 村 “了 5 平 机 此 国 盯 于 肌 


Ceigh Gy 560052003 Sgrnt tom A Rigrts Resnnmad 


本 章 的 实例 效果 


FT 


教学 重点 


购物 系统 分 析 与 设计 に 


购物 系统 数据 库 设计 ウ 

首页 设计 它 

商品 展示 动态 页 面 に 

商品 结算 功能 に 

订单 查询 功能 に 

购物 车 后 台 管 理 に 
辅助 页 面 
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如” 购物 系统 分 析 与 设计 





本 章 以 手机 在 线 销售 系统 为 模板 ， 介 绍 网 上 购物 系统 的 开发 与 制作 过 程 。 网 上 购物 系统 


是 一 个 比较 庞大 的 系统 ， 





竺 功能 模块 。 











它 必须 拥有 会 员 系统 、 查 询 系统 、 购 物流 程 、 会 员 服务 和 后 台 管理 


> 系统 功能 分 析 z 


本 章 以 掌 易 通 在 线 手机 销售 系统 为 实例 ， 介 绍 使 用 ASP 编写 购物 系统 的 方法 ， 购 物 系 
统 的 站 页 效果 如 图 9-1 所 示 。 


动 .. 手 机 网 后 。。 時 iGrngnEt Intmrmmt Esplorer 
变 件 证 1) 牙 格 層 ) 查看 让 中 本 nl 工員 Ti 称 助 注 i 


mm-6 回 国人 ぬお mm 辻 mm 9 加 ・ 史 そそ @ 


最 址 三) 晤 | htp:JPIET 0. Lf 
2 思 
掌 甸 遂 
EHANGETGONG 


商 而 采购 申 世 关于 昌 人 站 四半 中心 紀 証 厩 緒 忠 矯 身 岬 i 
新 闻 符 鲍 : 


解放 三 这 运 草 南 京 应 赋 涪 成 风云 作 模式 
爱国 尾 在 全 和 宇 原 本 者 上 年 柯 贡 的 江 二 和 隔 
后 国 手 朝 持 读 时 件 团 此 型 | 款 





9-1 开 友 设计 的 购物 系统 衣 页 效果 


对 于 该 网 站 的 功能 说 明 如 下 : 








采取 会 员 制 ， 以 保证 交易 的 安全 性 。 


本 专业 网 插手 机 请 时 机 构 





开发 了 强大 的 搜索 查询 功能 ， 可 以 帮助 用 户 快捷 地 找到 感 兴趣 的 手机 商品 。 





每 


F ゴ 
A 


有 目 己 专用 的 购物 





会 员 购 物流 程 : 浏览 一 将 商品 放 入 购物 车 一 去 收银 人 台 。 

和 车， 可 随时 订购 目 己 中 意 的 商品 并 结账 完成 购物 。 购 物 的 流程 是 指导 购物 车 系统 程 
序 编 写 的 主要 依据 。 

完善 的 会 员 服 务 功能 : 可 随时 查看 账目 明细 、 订 单 明 细 。 


设计 精品 推荐 展示 ， 能 够 显示 企业 近期 所 促销 的 一 些 特 价 商品 。 
后 台 管 理 使 用 本 地 数据 库 ， 保 证 购物 定单 安全 及 时 有 效 ， 并 可 处 理 强 大 的 统计 分 析 








功能 ， 便 于 管理 者 及 时 了 解 财务 状况 和 销售 状况 。 








购物 系统 











前 台 网 上 销售 人 模块。 所谓 前 台 网 上 销售 模块 ， 就 是 指 客 户 在 浏 帘 占 中 所 看 到 的 
直接 与 客户 面对面 的 销售 程序 ， 包 括 : 浏览 商品 、 订 购 商品 、 碍 询 定 购 和 购物 车 等 功能 ， 本 
实例 的 搜索 页 面 如 图 9-2 所 示 。 


动 .. 机 网 牛 . - Heroroft Internet Explorer 
文 位 ) 楠 稀 ほ ) 查看 吕 収 療 A) 工具 ① 帮助 人 0 


Ose・ の 回 回 @ PakmoBS EE: 


渚 站 中] 加 buty: 7/127.0.0. 1/protscU/ seuwr ch_r es L aspTsok_classTD=I10I0nme= 国 了 手 机 





通过 系统 功能 的 分 析 ， 访 网络 商店 主要 由 如 下 功能 模块 组 成 : > 


ZHANGETONG 


$ << 近 回 产 品 分 类 
产品 名 存 轩 状态 

x01001 在 第 辕 放 入 风物 在 
第 页 睦 页 上 一 页 1 下 一 页 








图 9-2 ”用户 搜索 界面 效果 


后 台数 据 录 入 模块 。 六 台所 销售 商品 的 所 有 数据 ， 其 来 源 都 是 后 台所 录入 的 数 
据 ， 后 台 的 产品 录入 界面 ， 如 图 9-3 所 示 。 


变 圳 证 ) 访 刁 是) 春草 上 0 収 還 ju) 工具 0) 本 局 好 
Gu OO- PO Pm ma 
le ET TP tL arp 
一 一 一 一 谨 加 商品 信息 : 
La ] 周 音 管理 
| Fm 生理 由 
| 产品 发 布 营 理 | 


加 ”商品 名 称 
责 品 职 骂 癌 | 





、 声量 肛 
We ds リ | 


| 出: 要. 伴 
癌 : 和 
大 下 外 全 同和 团 
人 乎 措 惠 《3 指 潮 








ーー sa EC 


回 回 
画 本 咎 
四 ”可 
拉 詩 E 
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后 台数 据 处 理 功 能 模块 。 所 谓 后 台数 据 处 理 ， 是 相对 于 前 台 网 上 销售 模块 而 
言 ， 网 上 销售 的 数据 ， 都 放 在 销售 数据 库 中 ， 对 这 部 分 的 数据 进行 处 理 ， 是 后 台数 据 处 理 模 
块 的 功能 ， 后 台 订 单 处 理 界面 如 图 9-4 所 示 。 


E . .手机 网 店 .. = 了 icrosoft Tnternet Explorer 
文件 ) 编辑 于) 查看 QW ”收藏 让) 工具 て ) 帮助 出 ) 
Om OO FEO Pm 次 sw dD A SE 
地 址 0) | 篇 | http:/7127.0.0. 1/admin/order_admin/order_list_markl. asp 

首页 茶 购 中 心 ”关于 我 们 ”新 闻 中 心 。 售后 服务 





服务 条 款 ”订单 查 词 ” 网 站 管理 








新 闻 友 布 管理 
添加 新 闻 
新 闻 管 理 
产品 支 布 管理 
添加 产品 
产品 管理 
后 台 订 单 管理 


订单 列表 
未 处 理 订单 
已 处 理 订单 


已 处 理 客户 订单 列表 : 


订单 号 : 200812156270 日 期 : 2008-12-15 


订购 商品 
zet001 


admin 
测试 的 地 址 
12345678 
12345678 
12@13.com 


标记 为 未 处 理 。 删除 
单价 
1578 


订单 总 额 : 1578 元 


国 回 回回 四 回 





让 
河 
时 
洁 


nl 
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用 户 注 册 功 能 模块 。 用 户 并 不 一 定 立 即 购买 东西 ， 可 以 先 注 册 ， 注 册 后 任何 时 
候 都 可 以 来 买 东西 ， 用 户 注 册 的 好 处 在 于 买 完 东 西 后 无 需 再 输入 一 大 堆 个 人 信息 ， 只 和 需 输 入 
账号 和 密码 就 可 以 了 ， 会 员 注 册页 面 如 图 9-5 所 示 。 


EE 。。 一 Nicrosoft Internet Explorer 
立件) ”编辑 字 ) 人 査 者 W) 收藏 入 工具 民 ) 帮助 而) 


Om O 回 回 @ Pm kmd ASE 


地 址 句 ) | http://127.0.0. 1/member/registe_ lmow.asp 








专业 网 络 手机 销售 机 构 


六 ; Web mobile shopping a 
@ 「 | "| 3 9 : | 
学 另 通 | “ \W ンー 
し | に ーー 1 
ZHANGETONG リノ ， 关于 我 们 
购物 流程 
物流 配送 
在 线 支付 
ーー 网 站 管理 
购物 车 : 
admin ， 欢 迎 你 
购物 车 中 共有 0 件 商品 
总 价值 0 元 
清空 购物 车 / 去 结算 


采购 中 心 关于 我 们 。 新 闻 中 心 


填写 注册 信息 
填写 注册 信息 前 请 您 先 阅读 服务 条 就 ! 
服务 条 款 
1、 服务 条 款 的 确认 和 接纳 

掌 易 通 的 各 项 服务 的 所 有 权 和 运作 权 归 北京 党 易 通 拥有 。 党 易 通 所 提 
供 的 服务 必须 按照 其 发 布 的 服务 条 款 和 操作 规则 严格 执行 。 用 户 通过 完成 
注册 程序 并 点 击 “ 我 同意 ”按钮 ， 表 示 用 户 接受 掌 易 通 的 所 有 服务 条 款 


搜索 系统 ， 2、 党 易 通 服务 简介 | 
、 移 易 通 运用 自己 的 操作 系统 通过 国际 互联 网 络 为 用 户 提供 各 项 网 络 服 


移 Internet 











密码 : 
在 线 注册 .… 








9-5 会 员 注 册页 面 效 果 








购物 系统 








订单 写 模 块 。 所谓 订 早 写 模 块 ， 束 是 娩 尸 购 关 完 商品 后 ， 系 统 会 日 动 分 配 一 个 


购物 号 人 码 给 客户 ， 以 便 客户 随时 查询 账单 的 处 理 情 况 ， 了 解 现在 货物 的 状态 。 客 户 订购 后 结 
算 中 心 的 页 面 效 果 如 图 9-6 所 示 。 


ES . .手机 网 店 -. - Nicroso ft Internet Explorer | | | > 
立件 ) ”编辑 下 ) 查看 名) 収 薄 ⑭) 工具 ) 帮助 加 ) 
Om O FEG Pm km OSE DEE 


地 址 Ju) | http://127.0.0. 1/shop/ shop. asp 











admin ， 欢 迎 你 ， 

购物 车 中 共有 1 件 商 品 

总 价值 1698 元 购物 车 信息 

清空 购物 车 /去 结算 SE 
购物 车 信息 日 期 : 2008-12-15 

| 

会 员 系统 : 订购 物品 数量 单价 

用 P:[L | zet002 1 1698 

ue: ei 1098 天 

在 线 注 册 .… 说 明 : 在 数量 选择 框 中 可 以 直接 修改 选 购 的 商品 数量 ,修改 为 “0” 表示 不 选 购 此 商品 。 

送 货 信息 

收 货 人 

送 货 地 址 

联系 电话 

手机 

Email 

附 言 






























































9-6 ”结算 中 心 的 页 和 面 效 末 


se 页 面 设 计 规划 


首先 为 本 购物 系统 创建 一 个 主要 文件 夹 chap09， 然 后 在 其 中 再 创建 多 个 子 文件 夹 ， 最 后 
将 文档 分 关 存 储 到 相应 的 文件 夹 中 。 读 者 可 以 打开 光盘 中 第 9 草 的 素材 , 可以 看 公 敵 点 的 文 
档 结构 和 文件 夹 结构 以 及 将 要 设计 完成 的 结构 如 图 9-7 所 示 : 


fs D:\chap09 
文件 ) 编辑 还 ) 查看 (加 ”收藏 和 ) 工具 民 ) 帮助 而) 


Om OF Pm Bm XX 用 六 XY QO 


a client 
images incoming_img 回 mdb 














member し order_ search 


service ワ shop 


config. asp 


< fe 


EE a 志 短 " asp DD ": pa ぎ 刈 asp 
«<> sa KE 《上 1 





4 我 的 电脑 
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下 面 从 站 点 规划 的 文件 夹 及 完成 的 页 面 出 发 ， 分 别 对 需要 设计 的 页 面 的 功能 分 析 如 下 : 

站 点 文件 夹 中 的 4 个 文件 及 功能 分 别 如 下 : 

index.asp: 购物 系统 的 首页 页 面 。 

config.asp: 被 相关 的 动态 页 面 调用 ， 用 来 实现 数据 库 连 接 。 

left menu.asp: 首页 左边 会 员 系 统 及 购物 搜索 功能 组 成 的 动态 页 面 。 单 独 制作 也 是 为 了 
方便 其 他 动态 页 面 的 调用 。 

main menu.asp: 网 站 的 导航 条 ， 对 于 一 个 网 站 来 说 ， 由 于 经 和 常 要 修改 栏目 ， 做 好 的 网 
站 页 和 面 很 多 ， 不 可 能 每 一 个 页面 都 进行 修改 ， 所 以 用 ASP 语言 建立 一 个 单独 的 页 面 ， 通 过 
调用 同一 个 页 面 实现 导航 条 的 制作 ， 这 样 修改 起 来 很 方便 。 

about_us 文件 夹 放置 关于 企业 介绍 的 一 些 内 容 ， 页 面具 有 一 个 。 

about us.asp: 关于 企业 的 内 容 简 介 页 面 。 

admin 文件 夹 放置 的 是 关于 整个 网 站 的 后 台 管 理 文 件 内 容 ， 又 分 别 包 插 了 
news admin、order admin 和 product admin 3 个 子 文件 夹 。 这 个 模块 是 购物 系统 中 的 难点 和 

news admin 文件 夹 是 放置 后 人 台新 闻 管 理 的 页 面 ， 在 前 面 已 经 介绍 过 具体 的 制作 方法 ， 
这 里 就 不 再 介绍 。 

order admin 文件 夹 是 放置 后 台 订 单 处 理 的 一 些 动态 页 面 。 里 面 分 别 放置 了 如 下 5 个 动 
态 页 面 : 

del orderasp: 删除 订单 。 

mark orderasp: 标记 已 处 理 订单 。 

order list.asp: 后 从 客户 订单 列表 。 

order list mark0.asp: 未 处 理 客 户 订 单列 表 。 

order list markl.asp: 已 处 理 客 户 订 单列 表 。 

product admin 文件 夹 用 来 放置 商品 管理 的 页 面 ， 主 要 包括 了 如 下 9 个 动态 页 面 ， 这 是 
购物 的 重点 和 难点 ， 并 涉及 到 上 传 图 片 等 编程 操作 。 

del product.asp: 删除 商品 页 面 。 

insert product.asp: 插入 商品 页 面 。 

product add.asp: 添加 丙 品 信息 页 面 。 

product listasp: 后 台 管理 商品 列表 。 

product modify.asp: 更 新 商品 信息 页 面 。 

update product.asp: 建立 上 传 命 令 动态 页 面 。 

upfile.asp: 上 传 文件 测试 动态 贝 面 。 

upfile.htm: 上 传 图 厂 文 件 议 态 测 试 页 面 。 

upload Sxsoft.inc: 上 传 文件 ASP 命令 模版 。 

check admin.asp: 用 于 判断 后 台 登 录 管 理 吴 份 确 认 动 态 文件 。 

client 文件 夹 用 于 放置 客户 中 心 的 内 容 页 面 ， 也 只 有 一 页 。 

client.asp: 制作 与 购物 相关 的 一 些 说 明 。 

imgaes 文件 夹 是 放置 网 站 建设 的 一 些 相 关 图 片 。 
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incoming _img 文件 夹 用 于 放置 商品 的 图 片 。 
mdb 文件 夹 用 于 放置 网 站 的 Access 数据 库 ， 所 有 的 购物 信息 及 数据 全 放 在 
人 
member 文件 夹 用 于 放置 会 员 的 一 些 相关 页 面 ， 主 要 包括 以 下 4 个 动态 页 而 : (>) 
login.asp: 注册 登录 页 面 。 ， 
logout.asp: 注册 失败 页 面 。 
registe.asp: 填写 注册 信息 页 面 。 
registe know.asp: 注册 需 知 说 明 页 面 。 
news 文件 夹 用 来 放置 网 站 新 闻 中 心 的 一 些 动 态 页 面 ， 主 要 包括 如 下 2 个 动 
态 页 面 : 
news content.asp: 新 闻 细 和 页 面 。 
news listasp: 显示 所 有 新 闻 列 表 页 面 。 
order search 文件 夹 用 来 放置 用 户 订单 查询 的 一 些 动态 页 面 ， 主 要 包括 如 下 两 
个 动态 页面 。 
order search.asp: 用 户 订 单 但 询 输 入 页 耐 。 
your orderasp: 用 户 订 单 得 询 结果 页 面 。 
product 文件 夹 用 于 放置 与 销售 产品 相关 的 页 面 。 主 要 包括 3 个 动态 页 面 。 
all list.asp: 所 有 产品 罗列 负面。 
product.asp: 产品 细 市 页 面 。 
search_result.asp: 产品 搜索 结果 页 面 。 
service 文件 夹 用 于 放置 售后 服务 的 一 些 说 明 页 耐 ， 只 有 一 个 说 明 页 耐 。 
service.asp: 用 来 说 明 售 后 服务 的 页 面 。 
shop 文件 夹 主要 用 于 放置 结算 的 一 些 动态 页 徊 ， 主 要 包括 如 下 5 个 动态 页 面 : 
add2bag.asp: 统计 订单 产品 数量 的 动态 页 面 。 
clear bag.asp: 清除 订单 信息 的 页 面 。 
orderasp: 订单 确认 信息 页 面 。 
order sure.asp: 订单 最 后 确认 页 和 面 。 
shop.asp: 订单 用 户 信 息 确 认 页 耐 。 
EL style 文件 夹 用 于 放置 页 面 的 CSS 文件 。 
index.css 用 于 控制 页 面 属性 的 CSS 样式 文件 。 
从 上 面 的 分 析 统 计 访 网 站 总 共 由 约 45 个 页 面 组 成 ， 几 乎 涉及 到 了 动态 网 站 建设 的 所 有 
的 功能 设计 。 其 中 用 户 注 册 系 统 、 新 闻 系 统 已 经 在 前 面 章节 中 详细 介绍 过 ， 本 章 重 点 介绍 网 
上 
Section_ 













































购物 系统 效 据 库 设计 


购物 系统 的 数据 库 设 计 可 以 从 功能 模块 入 手 ， 分 别 创建 不 同 命名 的 数据 天， 命名 的 时 候 
也 要 与 使 用 的 功能 命名 相配 合 ， 方 便 后 面相 关 页 面 设 计 制 作 时 调用 ， 将 数据 库 命名 为 
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shop.mdb， 在 数据 库 中 建立 7 个 不 同 的 数据 表 ， 如 图 9-8 所 示 。 


NT shop : 数据 库 (Access 2000 文件 格式 ) - Microsoft Access 
Na ーー 
| 开始 | 他 是 外部 数 握 数 振 誠 工具 




















oA, 总 


| 
| z ロコ 
记录 | 4Y | 和 、 | 调 旦 切换 窗 口误 找 、. 
| し 








| あめ 窗 体 大 小 ・ 
可 | 格式 文本 | | 排序 和 入 选 | 国人: 








全 警告 ”已 茜 用 了 数据 库 中 的 蔓 些 内 容 | ”选项 ,.. 








9-8 建立 的 数据 库 


对 于 各 数据 表 的 分 析 如 下 : 
产品 表 是 储存 产品 的 相关 信息 表 ， 产 品 表 相 应 的 字段 设置 见 表 9-1， 设 计 的 产 
品 表 如 图 9-9 所 示 。 











字段 名 称 | 数据 类 型 | 说 明 ー 

» 自动 编号 
商品 名 称 文本 

商品 编码 文本 
条 码 文 本 

零售 价 文本 
产地 文本 
_ 単位 文 本 
_ 規格 文 本 
产品 图 片 文本 
_ 子 美 別 Ip 文 本 
_ 根 美 別 ID 文本 

在 架 状 态 文本 0 表示 缺 货 ，1 表 示 在 架 

主页 推荐 文本 1 表示 推荐 

商品 说 明 备注 

字段 屋 性 
















一 一 | | 字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 坦 看 有 关 字 段 名 称 的 帮助 。 
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表 9-1 产品 表 相 应 的 字段 设置 





产品 主 闫 别 表 ， 是 把 商品 进行 分 类 后 的 一 级 类 别 表 。 主 要 设计 了 “ 主 闫 别 
ID” 和 “ 主 类 列 名 称 ” 两 个 字段 名 称 ， 可 以 根据 需要 展示 的 商品 种 类 ， 在 数据 表 中 加 入 商 咒 





的 类 别 ， 如 网 9-10 所 示 。 





转 产品 主 类 别 






字段 尾 性 


说 明 





| 常规 划 阅 

字段 大 小 50 
格式 

汰 入 控 結 

标题 

歌 认 什 

有 效 性 规则 

二 次 伍 立 工 

必 填 字段 和 
外 汗 識字 符 率 各 


索引 

Unicode 压缩 
输入 法 模式 
输入 法 语句 模式 
智能 标记 








字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 章 看 有 关 字 段 名 称 的 帮助 。 











图 9-10 


建立 产品 主 类 别 表 








图 声 品 主 美 別 


aa 


一 


主 类 别名 称 ・ 門 細 勘 学 義 
国产 手机 

智能 手机 

低位 手 机 

30 手 机 

多 媒体 手机 





| 记录 : 』 


筑 1 項 ( 共 5 項 ) と りほ | 各 





5 | 搜索 





产品 子 关 别 表 ， 是 把 商品 进行 分 类 后 的 二 级 类 别 表 。 主 要 设计 了 “ 子 闫 别 


ID”“ 子 类 别名 称 ” 





据 表 中 加 入 商品 的 名 称 ， 如 图 9-11 所 示 。 


及 “ 主 类 别 也” 三 个 字段 名 称 ， 根 据 需 要 展示 的 详细 商品 种 闪 ， 在 数 





> 








「 郊 林 天下 CT = 
に コ | 
也 沪 别 各 称 文 本 
主 深 制 1ID 妆 党 
地 占 暑 性 W 
LT 
于 阳 坟 小 sp - 
本 区 ーー 
時 子 类 别名 称 
笠 胃 
ua ' 国产 手机 
saas 而 经 名作 册 攻 可 二 54 邊 李 生 [生還 宮本 投 智能 手机 
ee Fi 权 可 看 显 帮 基地 起 癌 属 的 本 醒 。 
sa コ a 低位 手 机 
= PE Li se 手相 
Unicode 司 届 雷 
二 人 法 Ta 这 媒体 手机 
METaLrl 亚 畏 尼 , 
上 癌 a 记录 WH 4 和 项 ] 项 [ 芷 5 项 | 上 Nk 








图 9-11 设计 的 商品 子 类 别 表 
订单 表 是 储存 网 上 用 户 订购 的 相关 信息 表 ， 如 图 9-12 所 示 ， 订 单 表 字 段 设 计 




















见 表 9-2 o 
x 
6 > 万 自动 编 导 
订单 ID 文 本 生成 一 个 随机 数 来 表示 同一 批 的 订单 
用 戸 名 文 本 
订单 日 期 文本 20080808 表 示 2008 年 8 月 8 号 
是 和 否 处 理 文本 宁 冰 已 处 理 ，0 表 示 未 处 理 
收 货 文 本 
送 货 地 址 文本 
联系 电话 文本 
也 村 で で 林 マ 
字段 尾 性 
等 规 刘 阅 ey 
字段 大 长 莹 型 
新 值 着 着 
格式 
标题 
委 引 误 ( 无 重复 ) 
智能 标记 本 
字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
文本 对 齐 に 0 F1 键 可 查看 有 关 字 段 名 称 的 帮助 。 

















图 9-12 订单 数据 表 


表 9-2 订单 表 字段 设计 


义 | 字段 名 称 允许 空 字符 串 说 明 
订单 ID 文本 和 生成 一 个 随机 数 来 表示 同一 批 的 订单 
洋货 地 直 


中 


20070808 表示 2007 年 8 月 8 号 
1 表示 已 处 理 ，0 表示 未 处 理 


手机 手机 和 
附 言 255 否 
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订单 产品 表 ， 是 记录 用 户 在 网 上 订购 的 商品 信息 表 ， Cy 线 查 询 订 单 。 
主要 设计 了 “订单 商品 ID 天“ 订单 了 PE 和 “商品 DD” 及 “订购 数量 ”4 个 字段 名 称 ， 如 图 
9-13 所 示 。 


国 订单 产品 > 





字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 坦 看 有 关 字 段 名 称 的 帮助 。 


图 订单 产品 ii eg 4 
-| 订购 数量 
1 

















记录 : 《+ | 第 1 项 ( 共 1 项 | + Mm 贱 || 各 无 第 选 句 





9-13 ”设计 的 订单 商品 表 


狐 闻 表 是 用 于 储存 新 闻 的 数据 表 。 主 要 设计 了 了 “新闻 ID”“ 狐 闻 标 题 ” 和 “新 
阁 出 处 “新 闻 内 容 ” “新 闻 图 片 ” 及 “新 闻 日 期 ”6 个 字段 名 称 ， 如 图 9-14 所 示 。 


图 新 闻 表 


EM 
EE FE 


“新 闻 标 题 
“新闻 出 处 
新 闻 内 容 
新 闻 图 片 
新 闻 日 期 





ーーー+ 





字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 键 可 查看 有 关 字 段 名 称 的 帮助 。 











图 9-14 设计 的 新 闻 表 
用 户 表 是 用 于 储存 注册 用 户 的 数据 表 。 主 要 设计 了 “用 户 ID”“ 用 户 名 ”、 
全う 、 “真实 姓名 “性 别 ”、 66 全 “手机 ”、 66 电子 邮件 ”、 “住址 和 “说 明 22 及 “ 属 
性 ”11 个 字段 名 称 ， 如 图 9-15 所 示 。 
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字段 名 称 最 长 可 到 64 个 字符 (包括 空格 )。 按 
F1 链 可 查看 有 关 字段 名 称 的 帮助 。 





图 9-15 设计 用 户 表 
上 面 设计 的 数据 表 属 于 较 复 林 的 数据 表 ， 可 以 应 用 于 较 大 的 网 上 购物 系统 。 





自 页 设计 


首先 分 析 一 下 网 络 商 店 站 点 文件 夹 中 的 4 个 文件 。 对 于 一 个 购物 系统 来 说 需要 一 个 主页 
面 供用 户 进 行 注册 ， 搜 索 需 要 采购 的 商品 ， 网 上 浏览 商品 等 操作 。 首 页 index.asp 主要 由 


config.asp、left menu.asp 和 main menu.asp 三 个 页 面 组 而 成 ， 所 以 在 设计 之 前 先 要 完成 这 3 
个 页 面 的 设计 与 分 析 制 作 。 


9.3.1 数据 库 连 车 接 


用 ASP 开发 的 网 站 ， 可 以 通过 config.asp 页 面 实现 网 站 数据 库 的 连接 。 页 面 比较 简单 ， 
束 是 设置 数据 库 连 接 的 基本 命令 ， 如 图 9-16 所 示 。 


nD:\chapodconfie. asp (GrHTWL) = 
K%@LANGUAGE=" VESCRIPT" CODEPAGE=" 936"%> 

















‘a 


2 < 
下 为 数据 库 连 接 代 和 码 
cormstr="DEQ="+server. mappath('"/mdb/ shop. mdb" )+" :DefaultDir=:DRIVER= {Microsoft 上 Access Driver (*.mdbji:" 
a set com=server. createobject ("ADODE. CONNECTION" ) 
6 Co open cormstr 
> 


| 


a 
< 








1K71 秒 简体 中 娘 (GB2312)  .; 


图 9-16 设置 数据 库 连 接 
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对 于 本 连接 的 程序 说 明 如 下 : 


<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%> 
<% 

// 以 下 为 数据 库 连接 代码 
connstr="DBQ="+server.mappath("/mdb/shop.mdb")+": 
/设置 DBO 服务 器 物理 路 径 为 /ndb/shop.mdb 
DefaultDir=; DRIVER={Microsoft Access Driver (*.mdb)};" 
/定义 为 Access 数据 库 

set conn=server.createobject("ADODB.CONNECTION") 
/设置 为 ADODB 连接 

conn.open connstr 

/打开 数据 库 


200> 








读者 在 使 用 时 如 果 需 要 更 改 数据 库 名 称 ， 只 需要 将 该 页 面 中 的 shop.mdb 做 相应 的 更 改 
即 可 以 实现 。 














购物 需要 由 一 个 购物 流程 来 引导 用 户 在 网 上 实现 订购 ， 一 般 都 是 通过 用 户 自 身 的 登 
录 、 浏 览 、 定 购 和 结算 这 样 的 流程 来 实现 网 上 购物 的 ， 同 时 需要 加 入 搜索 功能 ， 以 方便 用 
ee ea 





























下 面 由 荔 能 分别 分 设计 和 能 1 

首先 分 析 核 心 部 分 ， 购 物 车 系统 ， 该 功 | ーー 

能 模块 完成 后 如 图 9-17 所 示 。 该 购物 车 系统 主要 有 实 1 た GS 

Ah 统计 购物 车 的 商品 ， 统 计 商 品 总 价 .购物 车 /去 结算 浊 、: 
值 ， 清 空 购物 车 ， 链 接 到 结算 功能 页 面 这 几 个 主要 的 。 ”图 9-17 完成 的 购物 车 用 户 系统 


| 
GE?) 此 段 程序 的 代码 如 下 所 示 : 


<table width="80%" border="0" cellspacing="0" cellpadding="2"> 
<tr> 
<td><font color="#FF3300"> 

<% 


if session("user")<>"" then 





response. Write(session("user")) 
else 
response.Write(" 流 客 " 
end if 
00> 
// 这 段 程 序 的 音 思 是 如 果 用 户 登 录 了 则 写 入 用 户 名 ， 如 果 没 有 登录 则 写 游 客 
</font><font color="1A3D05">， 欢 迎 你 ! </font></td> 











注册 及 搜索 ) 





の 
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</tr> 

<tr> 

<td><font color="1A3D05"> 购 物 车 中 共有 <font color="#FF3300"> 
% 
if session("all number")="" then 
0%0> 
0 
<% 
else 
0%0> 
<%=session("all number")%> 
<% 
end if 
0%0> 

/这 段 程序 是 统计 商品 的 总 数量 。 
</font> 件 商品 </font></td> 





</tr> 
<tr> 
<td><font color="1A3D05"> 总 价值 <font color="#FF3300"> 
<% 
if session("all price")="" then 
900>> 
0 
<% 
else 
0%0> 
<%=session("all price")%> 
<% 
end if 
06 テ 
/统计 商品 的 总 价 。 
</fon 人 元 </font></td> 
</tr> 
<tr> 
<td> 
<% 
if session("all number")="" then 
0%0> 





<strong><font color="1A3D05"> 清 空 购物 车 </font></strong> 
<font color="1A3D05">&nbsp;/&nbsp;<strong> 去 结算 </strong></font> 
<% 
else 
90>> 
<a href デ "shop/clear bag.asp"> 
/本 段 程序 是 调用 clear bag.asp 页 面 功能 实现 清空 购物 车 。 
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<strong> 清 空 购物 车 </stong></a>&nbsp:/&nbsp;<a hre 人 "shop/shop.asp"><strong> 去 结算 </strong></a> 
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/调用 shop.asp 页 面 进行 结算 。 
<% 
end if 
04> 


か の 


</tr> 


</table> 


完成 购物 车 系统 后 设计 用 户 注册 与 登录 系统 ， 该 系统 在 击 面 的 章节 中 已经 详细 
介绍 过 ， 这 里 就 不 再 介绍 ， 完 成 后 的 效果 如 图 9-18 所 示 。 

XI] 分 析 搜 索 功 能 模块 ， 搜 索 功 能 的 设计 与 制作 主要 是 通过 SQL 的 查询 语句 来 实 
现 的 ， 完 成 后 的 搜索 模块 如 图 9-19 所 示 。 

















cc 


も も モモ エモ モモ モモ モモ 


= 
和 


a 








MCM 
图 9-18 ”用户 登录 系统 图 9-19 ”商品 搜索 功能 模块 
得 询 的 功能 代码 主要 是 和 藤 套 在 单独 的 一 个 表单 FromSearch 之 中 ， 命 令 如 下 : 





<% 
set rs class=server.createobject("adodb.recordset") 
sql="select * from 商品 主 类 别 order by 主 类 别 ID" 
rs class.open sqlLconn,1,1 
00>> 
/建立 SQL 查询 语句 ， 通 过 商品 主 类 别 及 主 类 别 ID 来 查询 商品 数据 库 
<table width="84%" border="0" cellspacing="0" cellpadding="3"> 
<form name="FromSearch" method="post" action="product/search result.asp" onSubmit="return check()"> 
/提交 后 由 search result.asp 页 面 显 示 查 询 效果 
<tr> 
<td><img src="/images/Spacer.gif" width="1" height="6"></td> 
</tr> 
<tr> 
<td><font color="#FFFFFF"> 关键 词 : </font> </td> 
</tr> 
<tr> 





<td><input name="search key" type="text" class="inputl" size="26"> 
/设置 搜索 关键 词 文本 域 

<7td> 

</tr> 

<tr> 

<td><font color="#FFFFFF"> 类 ” 别 : </font></td> 

</tr> 
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<tr> 
<td> 
<select name="search class" class="inputl"> 
<option value="" selected>----- 所 有 和 商品 和英 列 -----<7option> 
<%6for 1=1 to rs class.RecordCount-1%> 


<option value="<%=rs class(" 主 美 列 ID")%>"><%=rs_class(" 主 类 别名 称 ")%></option> 





<% 
ifrs class.eof then 
exit for 
end if 
rs class.movenext 
next 
rs class.MoveFirst ' 把 记录 集 游标 移 到 第 一 条 记录 
00> 
</Select> 
/通过 商品 主 类 别 ID 和 主 类 别名 称 进 分 类 查询 
</td> 
</tr> 


tr valign="middle"> 
<td><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td><input name="imageField2" type="image" src="/images/index search bt.gif” width="57" 
height="21" border="0"></td> 
</tr> 
</table></td> 
</tr> 
<tr> 
<td><img src="/1mages/Spacer.gif" width="1" height="6"></td> 
</tr> 


</form> 


下 于 于 创建 导航 条 | 





这 里 将 使 用 ASP 语言 建立 导航 条 ， 完 成 后 的 代码 如 下 : 


<% 

if session("user prop")="admin" then 

main menu="<a hre 伍 "> 首页 </a> | 

<a hre 仁 7productall list.asp 人 > 采购 中 心 </a> | 

<a href='/about_us/about us.asp 人 > 关于 我 们 </a> | 

<a hre 仁 7news/news list.asp> 新 闻 中 心 </a> | 

<a href='/client/client.asp 人 > 售后 服务 </a> | 

<a href=/service/service.asp' > 服务 条 款 </a> ! 

<a hre 仁 7order search/order search.asp 人 > 订单 查询 </a> | 








购物 系统 





<a href='/admin/news admin/news add.asp> 网 站 管理 </a>" 
/如 果 登 录用 户 是 admin 则 显示 的 导航 内 容 
else /否则 导航 条 显示 如 下 的 内 容 

main menu="<a hre 伟 "> 首页 </a> | 

<a hre 仁 7productall list.asp 人 > 采购 中 心 </a> | 
<a href=/about us/about us.asp 作 关于 我 们 </a> 
<a hre 仁 7news/news list.asp 人 > 新 闻 中 心 </a> | 
<a hre 人 f=/client/client.asp> 售 后 服务 </a> | 

<a href=/service/service.asp' > 服务 条 款 </a> | 
<a href=/order search/order search.asp> 订 单 查询 </a>" 
end if 

00> 


这 个 页 面 设 置 了 导航 条 的 内 容 及 链接 情况 ， 并 进行 了 一 个 条 件 选 择 显示 ， 如 果 登 录 者 是 
admin 则 多 显示 “网 站 管理 ”功能 链接 ， 方 便 管 理 者 进入 后 人 台 进 行 管 理 ， 如 果 不 是 后 人 台 管 理 
者 则 显示 正常 的 导航 链接 ， 创 建 的 效果 如 图 9-20 所 示 。 
































| DD: vehap0gmain menn. asp [XHTYL) - 口 总 


< 入 

if sessinnl User Tn 』 ニ admin” then 

main merm=" “a href=" /index. asp > 自 軸 ama> | Ya href= /product/all_ 1ist, asp > 采购 中 心 
Aa | a href= /about_us/about_us. asp > 关于 我 们 a 

href= /newa/news_list. asp > 新 闻 中 心 “ay | href= /clientrclient. asp » 售 后 服务/ay 
| <a href=’/ servicer service, SD > 服务 条 款 ae 1 <a 

href=" “order saarch/nrder search. asp > 单 查 各:7a> | <a 

hret=” /admin/news_admin/news_add. asp” > 网 站 管理 */a>" 

ge 

ma1TL mernu=" “a href= ”imndex, asp ?首页 《a | <a href=’ “product/ all_ list. asp > 于 网 中 心 
“ay | a href=’ /about -usy about_ us. asp > 关于 我 们 &7 aa | <a 

href=" /news/news_list. asp "> 新 闻 中 心 “ar | Ya href= client client. asp » 售 后 服 备 /ay 
| za href=’/ servwicer service. asp’ > 服务 条 款 a 1 で ョ 

href=" /order_ search"order searrh.asn > 订单 查 疝 < a>" 

End 1f 

入 学 


1 Ki 税 価 必 中立 B2312) 








图 9-20 创建 导航 条 页 面 





index.asp 为 购物 系统 首页 页 面 ， 用 户 通 过 在 正 栏 中 输入 网 站 地 址 后 直接 可 以 打开 的 页 
面 ， 首 页 的 设计 分 析 如 下 : 

把 光盘 中 素材 chap09 文件 夹 中 的 网 上 购物 系统 复制 到 本 地 计算 机 便 稚 上， 由 
前 面 所 学 知识 创建 本 地 站 点 chap09， 并 设置 主 浏览 页 面 。 









二 デ 」 
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双击 “文件 ”面板 中 的 index.asp 页 面 ， 打 开 的 页 面 效果 如 图 9-21 所 示 。 


DW 区 人 (Fp) 画 揚 TE) 置 看 性) 政大 全] 邮政 库 ) 邊 式 可 ) 章 党 全 呈 直 臣 】 大 日 呈 ) 還 動 相 ! | 二 时 加 ”| 


BAS nig wap i 


a 
cha LnSm。 at 


感 記 六 本 (Emma Ul rt 
琴 赴 量 性 imtisu eal 
陸軍 時 欄 tk. 二 4 本 

IF 上 1 | し 上 時 





ee 


| rimmL| 間 素 yi キ 回 | 二 | Br 及 把 望 汪 而且 0) | 
本 ee | mmn キ | 要 _ 宣 轧 时 六 
.| "rl 二 直上 





9-21 设计 好 的 index.asp 页 面 
该 页 面 的 代码 比较 长 ， 这 里 把 实现 功能 的 一 些 重要 ASP 命令 列 出 说 明 。 在 导 
航 条 调 入 如 图 9-22 所 示 的 位 置 加 入 ASP 命令 如 下 : 
2 Ep Ce = | 








专业 网 络 手 机 销售 机 构 


Wgh mobile shopping At 


 G) 峰 易 Cs 
“ ZHANGETONG 甘于 我们 . 
购物 流程 
\ 物流 配送 


在 帳 喜 付 


9-22 ”导航 条 调 入 位 置 


ASP 命令 说 明 : 
<%=main Imenu%o> 
/调用 main menu.asp 
左辺 的 内 容 和 left menu.asp 页面 功能 是 一 样 的 ， 这 里 束 不 再 介绍 ， 中 间 是 由 
新 闻 系 统 和 精品 推荐 及 产品 分 类 功能 模块 组 成 ， 如 图 9-23 所 示 。 























购物 系统 





图 9-23 ”商品 展示 模块 


产品 分 类 模块 应 用 了 ASP 中 的 for 循环 命令 快速 建立 了 所 有 商品 的 展示 功能 ， 
该 段 动态 命令 如 下 : 


<table width="90%" border="0" cellpadding="S" cellspacing="0" class= fenlel > 
<% 

if (rs class.RecordCount mod 5)=0 then 

line=Int(rs class.RecordCoun1/S) 





else 
line=Int(rs class.RecordCoun175) 填 1 
end if 
for 1=1 to line 
if (1 mod 2)<>0 then 
0%0> 
/设置 商品 分 类 显示 行 数 为 5 
<tr> 
<td bgcolor="#FFFFFF"> 
<% 
for k=1 to 5 
ifrs class.eof then 
exit for 
else 
0%0> 


// 如 果 显 示 了 所 有 的 记录 则 关闭 会 询 

<a href="product/all list.asp"><%=rs_class(" 主 类 别名 称 ")%></a><img src="/images/Spacer.gif" 
width="6" height="1"> 

// 单 击 商品 类 别名 称 连 接 到 all list.asp 显示 全 部 商品 内 容 页 面 

<% 





rs class.MoveNext 
end if 


next 
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00>> 
</td> 
</tr> 

<% 
end if 
if (1 mod 2)=0 then 
0 る > 

<tr> 

<td> 

<% for k=1 to 5 
ifrs class.eof then 

exit for 
else 
00>> 


<a href="product/all list.asp"><%=rs_class(" 主 类 别名 称 ")%></a><img src="/images/Spacer.gif" 
width="6" height="1"> 

<% 
rs class.MoveNext 
end 1f 

next 

0%0> 
</td> 
</tr> 

<% 

end 1f 
next 
0%0> 


</table> 
网 上 购物 系统 的 首页 分 析 结 束 ， 如 果 需 要 快速 建立 购物 系统 的 首页 可 以 直接 参 
考 光 盘 中 已 完成 的 页 面 ， 得 看 代码 ， 可 以 快速 完成 购物 系统 首页 的 设计 与 制作 。 


94 商品 展示 动态 页 面 


product 文件 夹 用 于 放置 与 销售 商品 相关 的 页 面 。 主 要 包括 所 有 商品 罗列 页 面 
all listasp、 商 品 细节 页 面 product.asp 和 商品 搜索 结果 页 面 search result.asp。 下面 次 分 別 介 
绍 这 些 页 面 的 设计 。 


> 了 商品 罗列 页 面 


单 击 导航 条 中 的 “采购 中 心 ” 或 单 击 首页 中 的 “商品 分 类 ”中 的 商品 内 容 即 可 链接 到 的 
页 面 ， 主 要 用 于 显示 数据 库 中 的 所 有 商品 。 
首先 完成 静态 页 面 的 设计 ， 该 页 面 的 核心 部 分 在 “商品 选 购 ” 中 商品 二 级 分 类 



































的 显示 ， 其 他 部 分 功能 在 肯 页 设计 中 已 经 介绍 过 ， 


悦 . .手机 网 店 . - 一 Nicrosoft Internet Explorer 同 回 四 
文件 下) 编辑 区 ) 查看) ”收藏 入 工具 G) 娠 助 ⑪ 


Om © 回 回 @ の 昧 让 sx LS ae EE 


地 半 J) 错 http: f/f127.0.0. 1/product/all list. asp ~ | 蕊 了 转 到 | 


向 荔 另 通 (て コ 





ZHANGETONG ーー 
关于 我 们 


购物 流程 
物流 配送 
在 线 支 付 
首页 ”采购 中 心 ”关于 我 们 。 新 闻 中 心 。 售后 服务 
购物 车 : 
Im | ™ 
游客 ， 欢 迎 你 9 記 品 选 购 


购物 车 中 共有 0 件 商品 
总 价值 0 元 
清空 购物 车 /去 结算 


密码 : 


在 线 注册 .… 


搜索 系统 ， 





| ---- 产 品类 别 








Tnnwrinht FTnna-3nnao 0 コロ テー ロキ rnrn Bl Pinhte Pocorrodn 





夫 Tnternet 
9-24 ”设计 的 商品 罗列 页 面 


主要 核心 部 分 代码 如 下 所 示 : 





<table width="90%" border="0" cellpadding="5" cellspacing="0" class= fenlel "> 

<% 
for i=1 to rs.RecordCount 

0%0> 
/设置 记录 集 计算 循环 
<tr> 
<td width="79%" bgcolor="#FFFFFF"><strong><%=rs(" 主 类 别名 称 ")%></strong></td> 
/显示 主 类 别名 称 
<td width="21%" align="right" bgcolor="#FFFFFF"><a href="all listasp 喧 返回 总 分 类 </a>&nbsp; 
&nbsp; &nbsp;&nbsp;</td> 

</tr> 





<tr> 
<td colspan="2" class="line"> 
<% 
for J=1 to rs sub.RecordCount 
itrs sub.eof then 
rs sub.MoveFirst 
end if 
ifCIntrs sub(" 主 类 别 ID"))=CInt(rs(" 主 类 别 ID")) then 
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%> <a href="search result.asp?sub classID=<%=rs Sub(" 子 类 别 ID")%>&name=<%=rs sub(" 子 
类 别名 称 ")%>"> 
<%=rs_sub(" 子 类 别名 称 ")%></a> <% 
end 1f 
rs sub.MoveNext 





next 
00> 
/该 段 程序 是 在 页 面 中 显示 所 有 子 类 别名 称 的 代 但 
</td> 
</tr> 
<% 


rs.MoveNext 
next 
00> 


</table> 


在 完成 的 动态 页 面 中 ,“ 产 品 选 购 ” 说 明文 子 下 方 共 有 4 个 ASP 程序 图 标 ， 如 
图 9-25 所 示 ， 每 个 ASP 图 标 束 是 加 入 步 又 (2) 中 <%..%> 符号 之 间 的 4 名 不同 的 ASP 程序 。 





ED: vehap0g\productvall_list.asp m1 


HA config.asp main menu.asp index.css left menu.asp Fp 
a 一 人 Fr 


专业 网 络 手机 销售 机 构 


7 x Web mobile shopping a 
学 号 到 /// そ BW 衝 ここ 
ZHANGETONG J | ーー ニー マー 1 
> 关于 我 们 


购物 流程 
物流 配送 


在 线 支付 


: i 0 
: :{Session. all_number} | しま 


GQ 100%  v|864 x 443v| 74KA 2 秒 | 简体 中 文 (GB2312) 








购物 系统 中 所 有 商品 都 是 需要 显示 详细 信息 的 ， 接 下 来 束 要 设计 商品 细节 页 面 
productasp。 细 贡 页 面 用 于 显示 商品 所 有 的 详细 信息 包括 商品 价格 、 商 品 产地 、 a 
商品 图 片 等 ， 同 时 要 显示 是 否 在 架 (是否 还 有 商品 )， 放 入 购物 车 等 功能 。 

由 所 需要 建立 的 功能 出 发 ， 可 以 建立 如 图 9-26 所 示 的 动态 页 面 ， 页 面 中 一 个 
ASP 代码 图 标 代表 加 入 动态 命令 实现 该 功能 。 





























购物 系统 


で 放 入 购物 车 8 。。。 贿 折 其 ! 此 商品 时 贷 f : 





抱歉 ! 
本 商品 暂时 没有 图 片 ! 


|N 1 Q 1OOX v864 x 482v| 80 /2 秒 | 简体 中 文 (GB2312)| 





图 9-26 完成 的 设计 页 面 
下 和 面 对 该 模块 的 命令 分 析 如 下 : 


<table width="90%" border="0" cellpadding="5" cellspacing="0" class= fenlel "> 

<tr> 

<td width="44%" bgcolor="#FFFFFF"><strong> 商 品 编码 : <%=rs(" 商 品 编 码 ")%></strong></td> 
<td width="29%" bgcolor="#FFFFFF"> 


< 
ifrs(" 在 染 状 态 ")=0 then 
else 

00> 


<a hre 仁 "7shop/add2bag.asp7productID=<%=rs(" 商 品 ID")%>"><img src="../images/index dinggou.gif' 
width="84" height="16" border="0"></a> 





<% 

end 1f 

0%0> 

// 如 果 商 品 在 架 ， 单 击 放 入 购物 车 连接 add2bag.asp 页 面 实现 购物 功能 
</td> 

<td width="27%" align="right" bgcolor="#FFFFFF"> 
<% 
ifrs(" 在 架 状 态 ")=0 then 

0%0> 

<font color="#FF6600"> 抱 款 ! 此 商品 缺 货 ! </font> 
<% 
else 
0%0> 


font color="#FF6600"> 在 架 </font> 
% 
end if 
04> 
// 如 果 商 品 在 染 状 态 定 义 值 为 0， 则 显示 “抱歉 ! 此 商品 缺 货 ! ” 
</td> 
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</tr> 
<tr valign="top"> 
<td colspan="3" class="line"><table width="100%" border="0" cellpadding="3" cellspacing="0" class= 


"rightA"> 





< 人 tr> 
<td width="5%"><img src="../images/index title.gif" width="19" height="12"></td> 
<td><font color="#427012"><strong> 商 品名 称 : strong><7fonf> 
<%=rs(" 商 品名 称 ")%>// 显 示 商 品名 称 
</td> 
</tr> 
<tr> 
<td bgcolor="#FFFFFF"><1img src="../images/index title.gif" width="19" height="12"></td> 
<td bgcolor="#FFFFFF"><font color='#427012"><strong> 商 品 售 价 ;</strong></font><%=rs(" 零 售 
价 )%> 元 /显示 商品 价格 
</td> 
</tr> 











<tr> 

<td><img src="../images/index title.gif" width="19" height="12"></td> 

<td><font color="#427012"><strong> 障 上品 单位 : </strong></font><%=rs(" 和 单位 ")%>// 显 示 阐 品 蛙 
位 </td> 

</tr> 

<tr> 

<td bgcolor="#FFFFFF"><img sre="../images/index title.gif" width="19" height="12"></td> 

<td bgcolor="#FFFFFF"><font color='"#427012"><strong> 商 品 产地 : </strong></font><%=rs(" 产 
地 "9%>// 显 示 丙 品 产地 </td> 

</tr> 

<tr> 

<td class="fenlei"><img src="../images/index title.gif" width="19" height="12"></td> 

<td><font color="#427012"><strong> 商品 更 明 : </strong></font><%=rs(" 商 品 说 明 ")%>/ 显 示 商 
品 说 明 </td> 

</tr> 
<tr> 

<td class="fenlei"><1img src="../images/index title.gif" width="19" height="12"></td> 

<td><font color="#427012"><strong> 障 上 蜗 图 片 : </strong></font></td> 

</tr> 

<tr> 
<td class="fenlei">&nbsp;</td> 
<td valign="top"> 


<% 
ifrs(" 商 品 图 万 )="" then 
00> 

<img src="../incoming img/no photo.glif width="500" height="186"> 
<% 

else 

0%0> 

<img src="../incoming img/<%=rs(" 障 总 图 片 ”)%>"> 

<% 


end if 











04> 

/显示 商品 图 片 
</td> 

</tr> 

<tr> 








<td colspan="2" class="fenlei"><img src="../images/Spacer.gif" width="1" height="5"></td> 
</tr> 


</table></td> 
</tr> 
</table> 


商品 细节 页 的 设计 不 是 一 成 不 变 的 ， 该 页 面 实际 是 显示 记录 集 的 页 面 ， 在 实际 


操作 中 需要 建立 数据 库 连 接 ， 建 立 但 询 记 录 集 ， 最 后 绑 定 想 要 显示 的 字段 ， 则 可 以 完成 商品 
细 厂 页 的 设计 。 

















過当 商品 搜索 结果 页 面 ー 


在 首页 中 有 一 个 商品 搜索 功能 栏 ， 通 过 和 输入 搜索 的 商品 ， 单 击 搜索 撤 钮 打开 的 页 面 就 是 
这 个 商品 搜索 结 琳 页 面 search resultasp。 该 页 面包 括 的 功能 有 由 搜索 页 传递 过 来 的 字段 搜索 
数据 库 中 的 数据 并 显示 该 商品 ， 为 了 方便 购物 在 找到 的 显示 商品 中 还 需要 设置 商品 的 名 称 、 
报价 、 在 染 状 态 ， 同 时 要 加 入 购物 车 功能 ， 在 制作 搜索 结 末 页 的 时 候 还 需要 卷 虑 到 一 个 问 
题 ， 那 殉 是 很 可 能 在 搜索 的 字段 当中 会 有 很 多 商品 相似 ， 如 输入 “zet”， 则 所 有 数据 中 市 
“zet” 了 学 段 的 商品 邦 会 列 在 该 页面 ， 所 以 要 创建 寻 航 条 还 有 记录 统计 等 功能 。 

由 上 和 面 的 功能 分 析出 及 ， 设 计 好 的 商品 搜索 结果 页 面 如 图 9-27 所 示 。 


引 . .手机 网 店 .. icrosoft Internet Explorer 
立件 び ) 端 缉 在 )】 查看 加 业 家 内 ) 工具 立 ) 税 助 ①) 


On ©O EO Pm ma OL Se JTS 


地 址 站) http' /11/127 DO lfprodoct/ saarch _ rerlt Ap 

















党 多 通 


ZHANGETONG 


首 贝 ”来 购 中 心 部 闻 中 心 。 售 语 服务 


购 多 车 : 


游客 ， 欢 迎 你 ? 产品 选 购 


购物 车 中 共有 0 持 商 品 


和民 0 元 产品 列表 
清空 攀 物 / 大 站 区 


此 摔 索 的 关键 词 是 : zet “< 返回 产品 分 类 
介し し {Il ym001 守 直入 移 生 キ 
に ym1002 宮 前 入 购物 证 
還 和 |] eewr 和 mj zel003 に 
搜索 系统 ， zal004 トー・ 喜人 入 购物 车 


1 幕 1 页 上 污 1 页 上 一 页 /1 下 一 页 
| 





TTP 
| 搜索 | 


PFW w 


Copyriont @ 20052009 30zet com All Rights Reserved 





图 9-27 搜索 的 实际 结果 


SS 














本 页 面相 关 的 程序 分 析 如 下 : 





<table width="100%" border="0" cellspacing="0" cellpadding="0"> 

<tr> 

<td>&nbsp;</td> 

</tr> 

<tr> 

<td><img src="../images/index pro011.gif" width="573" height="41"></td> 

</tr> 

<tr> 

<td ahgn="center" valign="top" background="../images/index pro03.g1f"><table 
border="0" cellpadding="5" cellspacing="0" class="fenle1"> 


<tr> 

<td width="77%" bgcolor="#FFFFFF"> 
<% 
it Request("search key")<>"" then 
0%0> 





<strong> 您 搜索 的 关键 词 是 :</strong><font color='"#FF3300">&nbsp; 
<%=Request("search key")%></font> 

<% 

else 

04> 

<strong><%=Request("name")%>: </strong> 

<% 

end if 

04> 

/在 搜索 的 关键 词 后 面 显示 前 面 输入 搜索 的 阶段 变量 即 搜索 的 名 称 值 
</td> 
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width="90%" 


<td width="23%" bgcolor="#FFFFFF"><a href="all listasp">&lt&lt 返 回 商品 分 类 </a></td> 


</tr> 
</table> 
<table width="90%" border="0" cellpadding="0" cellspacing="0" > 
<tr> 
<td><img src="../images/Spacer. gif" width="1" height="3"></td> 
</tr> 
</table> 
<table width="90%" border="0" cellpadding="5" cellspacing="0" class="fenlei"> 
<tr> 
<td width="48%" bgcolor="#FFFFFF"><strong> 商 品名 </strong></td> 
<td width="17%" bgcolor="#FFFFFF"><strong> 报 价 </strong></td> 
<td width="16%" bgcolor="#FFFFFF"><strone> 在 染 状 态 </strong></td> 
<td width="19%" bgcolor="#FFFFFF">&nbsp;</td> 
</tr> 
<% 
if rs.recordcount<>0 then 
for 1=1 to pagesize 
if rs.eof then 








第 9 章 他 用 引荐 生气 





exit for 
end if 
04 テ 


<% " 
if (1 mod 2)=0 then > 


90>> 
<tr bgcolor="#EBEBEB"> 
<% 
end if 
90>> 
/显示 所 有 的 搜索 结 
<td><a href="product.asp?productID=<%=rs(" 商 品 ID")%>" target=" blank"><%=rs(" 商 品名 称 ")%> 
</a></td> 
<td><%=rs(" 零 售 价 )%></td> 
/通过 商品 ID 打开 商品 名 称 
<td> 
<% 
ifrs(" 在 架 状 态 ")=0 then 


response.Write(" 缺 贷 " 














else 
response. Write(" 在 架 ") 

end if 

04> 
// 显 示 商 品 是 否 在 涤 或 者 缺 贷 
</td> 


<td><font color="1A3D05"><a href="/shop/add2bag.asp?productID=<%=rs(" 商 品 ID")%>"><img 
src="../images/index dinggou.gif" width="84" height="16" border="0"></a></font></td> 
</tr> 
<% 
rs.MoveNext 
next 
else 
0%0> 
<tr bgcolor="#EBEBEB"> 
<td colspan="4"><font color="#FF3300"> 抱 妆 ! 您 选择 的 分 类 暂时 没有 货物 ， 请 您 电话 与 我 们 联 
系 ! </font></td> 
</tr> 
<% 
end if 


rs.close 





set rs=nothing 
conn.close 
set conn=nothing 
0%0> 
</table> 
<table width="90%" border="0" cellpadding="8" cellspacing="0" class="fenle1"> 
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<tr> 
<td width="359%0"> 第 <%=page%> 页 / 共 <%=pageall%> 页 /统计 搜索 总 数 </td> 
<td width="32%">&nbsp;</td> 
<td width="33%" align="right"> 
<%If Cint(page-1)<=0 then 
response.write "上 一 页 " 
elSe%o> 
<ahref="search result.asp?page=<%=page-1%>&name=<%=Request("name")%>&sub_classID= 
<%=Request("sub_classID")%>&search key=<%=request("search key")%>&search class=<%=request 
("search class")%>"> 上 一 页 </a> 
<%end 1f%> 
&nbsp;/&nbsp; 
<%olf Cint(page+l)>Cint(pageall) then 
response.write "下 一 页 " 
else%> 
<ahref="search result.asp?page=<%=page+1%>&name=<%=Request( "name")%>&sub_classID=<%=R 
equest("sub classID")%>&search key=<%=request("search key")%>&search class=<%=request("search cla 
ss")%>"> 下 一 页 </a> 
<%end if %> 
</td> 
</tr> 
</table></td> 
</tr> 
<tr> 
<td><img src="../images/index pro02.gif" width="573" height="46"></td> 
</tr> 


</table> 





到 这 里 就 完成 了 商品 相关 动态 负面 的 设计 ， 可 以 实现 商品 的 展示 功能 。 


_Section_ 


强 商品 结算 功能 





购物 车 的 主要 功能 就 是 进行 商品 结 得， 通过 这 个 功能 用 户 在 选择 了 目 己 豆 欢 的 商品 后 可 
以 通过 网 络 确认 所 需要 的 商品 ， 输 入 联系 办 法 ， 所 交 后 写 入 数据 库 方便 网 站 定理 者 进行 售后 
服务 ， 这 也 是 购物 车 系统 的 核心 功能 。 


9.5.1 统计 名 时 
Add2bag.asp 页 面 在 前 面 的 代码 中 经 常 应 用 到 ， 就 是 单 击 “ 放 入 购物 车 ”图 标 按钮 后 


祁 调 用 该 页 面 ， 主 要 是 实现 统计 订单 数量 的 功能 页 面 。 访 页面 完 全 是 ASP 代码 ， 如 图 9-28 
所 示 。 






































“1--#include file=". 
<% 
productTD=renuest (“productID") 
Set rs=server. createobject ("adodb. recordset") 
sql="select * from 产品 表 where 产品 ID="&productID&”order by 产品 ID” 
rs. open sql, corm, 1 。 1 
if rs.recordcount<>0 then 

session("all_mumber" )=session("all_rmumber" )+1 


./ config. asp 一 -> 












sessiont "product"&sessiont"all_number"))=productID 
session("all_ nrice")=sess1am("a11 nrice")+CDb1(rs(" 等 隻 件 ")) 
end if 
rs. close 
set rs=nothing 
response. Redirect ("../index. asp”) 








for i=1 to CInt (session("all_number" ) ) 
六 > 

<W=session("product"&i)&" <br>"%> 

上 

next 

闹 > 














6 有 辐 国 [四 瞧 >= 












2K ア 1 秒 简体 中 文 (G6B2312) 
9-28 add2bag.asp 页 面 的 设计 
代码 分 析 如 下 : 


<!--#include file="../config.asp"--> 

/调用 config.asp 人 确认 数据 库 连 接 

<% 

productID=request("productID") 

// 定 义 阶段 变量 productID 

set rs=server.createobject("adodb.recordset") 

/创建 记录 集 

sq="select * from 产品 表 where 产品 ID="&productID&" order by 产品 ID" 

/用 sql 查询 功能 通过 产品 ID 与 productID 核对 

rs.open sql,conn,1,1 

if rs.recordcount<>0 then 
session("all number")=session("all number") 十 1 

/通过 session 记录 放 入 的 购物 篮 产品 的 总 个 数 
session("product"&session("all number"))=productID 
session("all price")=session("all price")+CDbl(rs(" 零 售 价 ")) 

end 1f 

rs.close 

set rs=nothing 

response.Redirect(request.serverVariables("Http REFERER")) 

0%0> 

// 如 果 是 定购 则 产品 的 总 个 数 加 1， 购物 总 价 加 入 刚 定 购 产 品 的 零售 价 

<% 

for 1=1 to CInt(session("all number")) 

0%0> 

<%=session("product"&1)&"<br>"%> 

<% 

next 

0%0> 


代码 说 明 : 
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session 在 Web 技术 中 占有 非常 重要 的 位 置 。 由 于 网 页 是 一 种 无 状态 的 连接 程序 ， 因 此 
无 法 得 知 用 户 的 浏览 状态 。 因 此 必须 通过 session 记录 用 户 的 有 关 人 信息， 以 供用 户 再 次 以 此 
身份 对 Web 服务 器 提供 要 求 。 


”清除 订单 


clear bag.asp 页 面 是 清除 订单 信息 的 页 面 ， 通 过 单 击 文字 “清空 ”能 够 调用 clear bag.asp 
页 面 ， 通 过 里 面 的 命令 清空 购物 车 中 的 数据 统计 ， 设 计 的 asp 命令 如 图 9-29 所 示 。 























名 


HiYchlanndtshlnntclear bae. asp TKHTML) = 品 茂 





1 で を LMMETLGE= "WESEETPT"T CODEPAGE="936" 和 4» 
由 に 
USEL=SESSlOn 1 LSELE ) 
USBEL LYDE=3SESSTLOI USEL prop"™) 
3eE33i0n.Contents.Remowvedllii 
3E331i0n1"U3er")=uU3er 
SESSinnhl "User prop")=u3er type 
EEgBDIABG REHLEEGEIFBGLUEBE。 servervariablesti"Http PEFEPRER™)) 
に 





1 1 和 Unicode MTF- 


图 9-29 clear bag.asp 负面 
清除 订单 的 代码 如 下 : 


<%QWLANGUAGE="VBSCRIPT" CODEPAGE="936"%> 
<% 

user=session( "user") 

user type=session("user prop") 
session.Contents.RemoveAll() 

session("user")=user 

session("user prop")=user tyDe 
response.Redirect(request.serverVariables("Http REFERER")) 
900> 


/通过 RemoveAlO 命 令 实现 清空 session 中 的 记录 


sR 用 户 信 息 确认 订 早 


用 户 登 录 后 选择 商品 放 入 购物 车 ， 单 击 首 页 上 的 “去 结算 ”按钮 ， 则 打开 用 户 信 息 订 单 
确认 页 面 shop.asp， 访 页 面 主要 用 于 显示 选择 的 购物 商品 数量 及 总 价 ， 需 要 设置 输入 “ 送 货 
信息 ”功能 ， 然 后 单 击 “ 继 续 ”按钮 把 输入 的 信息 存 入 数据 库 中 ， 打 开 订 音信 息 确 认 页 面 
orderasp。 访 页 面 完 成 后 的 效果 如 图 9-30 所 示 。 从 功能 上 可 以 看 出 该 页 面 的 功能 有 点 类 似 于 
留言 板 的 功能 。 只 不 过 多 了 订单 商品 统计 功能 。 订 单 商品 的 统计 功能 和 add2bag.asp 页 面 的 





























统计 功能 一 样 ， 所 以 本 页 的 程序 就 不 再 分 析 介 绍 ， 读 者 可 目 行 打开 本 书 配套 光盘 中 的 该 页 
面 ， 对 代码 进行 浏览 分 析 。 
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图 9-30 订单 信息 确认 页 面 效 果 


so 订单 确认 信息 


单 击 shop.asp 页 面 中 的 “结算 ”按钮 后 打开 orderasp 订单 确认 页 面 ， 该 页 面 同 shop 页 
面 的 结构 ， 在 送 货 信息 中 显示 了 上 一 页 中 输入 的 送 货 详细 信息 ， NE 
板 功 能 ， 设 置 的 结果 如 图 9-31 所 示 。 设 计 命 令 前 面 已 全 部 介绍 过 这 里 不 再 介 
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9-31 订单 确认 页 面 
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:IN 订单 最 后 确认 
单 击 订单 确认 信息 页 面 orderasp 中 的 “生成 订单 ”按钮 ， 融 可 以 打开 order sure.asp 页 


面 ， 该 页面 的 功能 是 在 订单 号 入 数据 库 后 弹出 的 完成 购物 页 面 ， 访 页面 的 设计 同 orderasp, 
上 只 是 减少 了 “ 送 货 信 息 ” 的 内 容 ， 共 体 的 制作 不 再 介绍 ， 结 朱 如 网 9-32 所 示 。 


四 ichap03kshontorder_sure.asp = 回 








NL config.asp main menu. asp index.css left menu.asp 


专业 网 络 手机 销售 机 构 


‘4 Web mobile shopping / 
学 另 通 ” /// ンー 
ZHANGETONG Ij コーマ デ 1 

< 关于 我 们 

购物 流程 

物流 配送 


在 线 支付 


1 a AT 
: :session. all_number 器 件 : : 


vost : 
: 清空 购物 车 /去 结算 渭 。 ， : 
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9-32 ”完成 购物 订单 效果 





EX。 订单 查询 功能 








用 户 在 购物 时 还 需要 知道 自己 在 近 一 段 时 间 一 共 购 买 了 多 少 商品 ， 单 击 导 航 条 中 的 “ 订 
单 租 询 ” 人 命令， 打开 答 询 输入 的 页 面 order search.asp， 在 得 询 文 本 域 中 输入 客户 的 订单 编 
写 ， i 于 your_order.asp 页 面 得 到 订 定 的 处 理 情况 ， 方 便 与 网 站 管理 者 沟通 


:订单 查询 输入 


订单 合 询 功能 和 首页 中 的 商品 搜索 功能 设计 方法 是 一 样 的 ， 和 需要 在 输入 的 俘 询 负面 中 设 
置 好 数据 库 连 接 ， 设 置 得 询 输 入 文本 域 ， 建 立 SQL 查询 命令， 具体 的 设计 分 析 同 前 面 的 搜 
索 功 能 模块 设计 ， 完 成 后 的 效果 如 图 9-33 所 示 。 
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图 9-33 订单 查询 页 面 


sR 天才 Mi] 早 查 询 纺 果 


your orderasp 负面 是 用 户 输 入 订单 查询 后 ， 单 击 “ 查 询 ” 按 钮 弹出 的 查询 结果 页 面 。 设 
计 分 析 同 search_result.asp， 这 里 不 再 介绍 ， 完 成 后 的 效果 如 图 9-34 所 示 。 
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图 9-34 用 户 订单 查询 结果 








购物 车 后 合 警 理 


购物 车 后 从 系统 是 整个 网 站 建设 的 难点 ， 它 几乎 包括 了 所 有 的 常用 ASP 处 理 技术 ， 包 
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括 了 新 闻 系 统 的 管理 功能 、 订 单 的 处 理 功 能 和 商品 的 管理 功能 。 新 闻 系 统 的 管理 在 前 面 草 节 
中 已 经 介绍 过 ， 这 里 不 再 介绍 ， 在 此 重点 介绍 订单 处 理 功 能 和 商品 的 管理 功能 。 


= 局 全 册 后 全 登录 


网 站 拥有 者 需要 登录 后 台 管 理 网 上 购物 系统 ， 由 于 涉及 到 很 多 丙 业 机 蜜 ， 所 以 需要 议 计 
登录 用 户 确 认 页 面 ， 通 过 输入 唯一 的 用 户 名 和 密码 才 可 以 登录 后 台 进 行 管 理 。 本 网 上 购物 系 
统 为 了 方便 使 用 ， 只 和 需要 在 目 负 用 户 系 统 中 直接 输入 “用 户 名 ”admin 和 “密码 ”admin， 丈 
可 以 登录 后 台 。 因 此 需要 制作 用 于 判断 后 台 登 录 管理 里 份 确认 的 动态 文件 check admin.asp。 

该 页 面 制 作 也 比较 人 简单， 完成 后 的 代码 如 下 : 


<% 
1f session("user prop")<>"admin" then 
response.Redirect("/member/login.asp?error in 传 请 用 管理 员 账 号 登录 进入 后 台 管 理 ! 由 
end if 
900>> 


// 判 断 有 用户 是 否 为 admin， 如 果 不 古 就 打开 出 错 信息 页 面 


s 记 2 订单 管理 


order admin 文件 夹 用 于 放置 后 台 订 单 处 理 的 一 些 动 态 页 面 。 里 面 分 别 放置 了 如 下 5 个 
动态 页 面 : 

del orderasp: 删除 订单 。 

mark orderasp: 标记 已 处 理 订单 。 

order list.asp: 后 台 客 户 订 单列 表 。 

order list mark0.asp: 未 处 理 客 户 订 单列 表 。 

order list markl.asp: 已 处 理 客 户 订 单列 表 。 

下 面 分 别 分 析 各 页 面 的 ASP 命令 : 

用 于 删除 订单 的 动态 页 面 del orderasp， 如 图 9-35 所 示 。 







































































ED: \chap03\admintorder_admin\del_order. asp (KHTML) - x 
CL config.asp check admin.asp YT 
《1!--#include file="../../config.asp"--> 
Bb EN < |——#include file="../check_admin. asp” ——> 


4 if request ("del_orderID")<>"" then 
5 Set rs_order_product = cam.execute("delete * from 订单 产品 WHERE 订单 ID="*“&request ("del_orderID")&"*") 
Set rs_order = corm. execute("delete * from 订单 表 WHERE 订单 ID=”"&request (“del_orderID")& "の") 
1f Err.Number> then 
response.Wwrite“ 对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 ...” 
response. end 
else 
cornn. close 
set corm=nothing 
response. redirect "order_list. asp" 
end 1f 
clse 
6 conn. close 
| 于 | set Corn=rnothing 
天 二 8 response. Redirect (request. serverVariables ("Http_REFERER" ) ) 
ESE end 1f 
六 > 
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图 9-35 删除 订单 页 面 del order.asp 





购物 系统 





ASP 命令 说 明 如 下 : 


<!--#include file="../../config.asp"--> 
/通过 config.asp 页 面 建 立 数据 库 连 接 
<!--#include file="../check admin.asD "-- テ > 
<% 
if request("del orderID")<>"" then 
Set rs order product = conn.execute("delete * from 订单 商品 WHERE 订单 ID="&request ("del_ 
orderID")&"") 

// 通过 delete 命令 删除 订单 
Setrs order = conn.execute("delete * from 订单 表 WHERE 订单 ID="&request("del orderID")&"") 

if Err.Number>0 then 

response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 … 
response.end 

/删除 失败 显示 的 信息 

else 








conn.close 
set conn=nothing 
response.redirect "order Iist.asp" 
end if 
else 
conn.close 
set conn=nothing 
response.Redirect(request.serverVariables( "Http REFERER")) 
end if 
0%0> 


mark orderasp 标记 已 处 理 订单 ， 如 图 9-36 所 示 。 


| nr い chap09Vadmintordsy_admintmayk_order.asp (XHTML) = El 


config.asp check admin. asp 
《1--#include file="../../confige. asp ——> 
《1--#include file="../check_admin. asp” ——> 
< 六 
if request ("mark_orderID")<>"" then 
set rs=server. createobject ("adodb. recordset") 
sql="update 订单 表 set 是 否 处理 =”"&request ("mark")&””where 订单 ID=”"&request ("mark_arderTD")& 
rs. open sqgl, Corm。 1, 1 
1f Err. Number?0 then 
response. write“ 对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 懂 再 试 ..." 
response. end 
else 
response. redirect (request. serverVariables ("Http_REFERER" ) ) 
end if 
end 1f 
rs. close 
set rs=nothing 
corm. close 
set corrn=rnothing 
六 > 
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图 9-36 标记 已 处 理 订单 页 面 


程序 说 明 如 下 : 


<!--#include file="../../config.asp"--> 


/通过 config.asp 页 面 建立 数据 库 连 接 








< プ 
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<!--#include file="../check admin.asp"--> 
<% 
if request("mark orderID")<>"" then 

set rs=server.createobject("adodb.recordset") 

sql="update 订单 表 set 是 否 处 理 ="&request("mark")&" where 订单 ID="&request("mark 
orderID")&"" 

rs.open Sql,conn,1 ,1 
/如 果 请 求 变量 mark orderID 不 为 宇 ， 则 标记 为 已 处 理 订 单 

if Err.Number>0 then 
response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 …" 


response.end 





else 
response.redirect(request.serverVariables("Http REFERER")) 
end if 
end if 
Ts.close 
set rs=nothing 
conn.close 
set conn=nothing 
0%0> 


order_listasp 后 台 客 户 订单 列表 的 设计 页 面 如 图 9-37 所 示 。 该 页 面 中 有 “ 订 
单 查询 ”功能 ， 还 有 订单 的 详细 结果 ， 这 些 技术 在 前 面 的 页 面 制作 中 已 经 介绍 
方 在 于 “订单 号 : ”这 一 栏 ， 里 面 有 删除 订单 功能 。 


中 | itchap03tadmintiorder_admirorder 1ist.asp こ 回 





config. asp check admin.asp main menu. asp index. css 


a es 
按 订 单 号 查询 : 昔 
トト すす すす ササ サ すす ササ すす すす すす すす すす す YYYYTYYrE エ デム ~ 
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9-37 客户 订单 列表 
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下 面 对 访 行 的 代码 进行 分 析 说 明 : 
<tr> 
<td width="30%" bgcolor="#FFFFFF"><strong> 订 蛙 写 : <%=rs order(" 订 早 ID")%> 
// 显 示人 处 理 的 订单 编写 © 
</strong></td> 
<td width="24%" bgcolor="#FFFFFF"> 日 期 : <%=rs_order(" 订 单 日 期 )%></td> 
<td width="16%" bgcolor="#FFFFFF"> <% 
ifrs order(" 是 合 处 理 )=1l then 
%> <font color="#FF6600"> 己 处 理 </font> 
<% 
else 
%> <font color="#0033FF"> 未 处 理 </font> <%end if2%> </td> 
// 如 果 僵 得 " 是 否 处 理 " 的 值 为 1 那么 显示 为 已 处 理 ， 人 否则 显示 为 未 处 理 
<td width="30%" bgcolor="#FFFFFF"><table width="100%" border="0" cellspacing="3" cellpadding="0"> 
<tr> 
<td width="65%" align="center" valign="middle" bgcolor="#C4DCB6" onMouseOver="mOvr 
(this,#79B43D');" on MouseOut="mOut(this,'#C4DCBO6');" > 


<% 
ifrs order(" 古 人 奋 人 处 理 ")=1 then 
0%0> 
<a href="mark order.asp2mark orderID=<%=rs order(" 订 单 ID)%>&mark=0"> 标 记 为 未 处 理 </a> 
<% 
else 
0%0> 
<a href="mark order.asp?mark orderID=<%=rs order(" 订 单 D")%>&mark=1' 人 > 标记 为 已 处 理 <Ja> 
<%end lfyo> 
// 标 记 是 否 处 理 的 订单 ， 并 通过 订单 ID 号 设置 连接 页 面 
</td> 


<td width="35%" align="center" valign="middle" bgcolor="#C4DCB6" onMouseOver="mOvr 
(this,#79B43D');" on MouseOut="mOut(this,'#C4DCBO6');" > 
<a href="del order.asp?del orderID=<%=rs order(" 订 单 ID の >" onClick="return confirm( 真 的 要 删 
除 这 份 订单 吗 ? "> 删除 
/通过 订单 ID 删除 选择 的 订单 
</a></td> 
</tr> 
</table></td> 


</tr> 


order list mark0.asp 未 处 理 客户 订单 列表 用 于 显示 所 有 没有 处 理 的 客户 订单 页 
面 ， 完 成 后 的 设计 效果 如 图 9-38 所 示 。 该 页面 的 制作 同 order_listasp， 除 减少 了 搜索 功能 ， 
该 页 面 中 显示 的 是 rs_order(" 是 否 人 处理 "=1 的 所 有 未 处 理 订 单 。 有 具体 的 代 但 读者 可 奉 看 光盘 
中 的 源 代码 。 
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中 | D: tchap09tadmirtorder_admirtorder 1ist mark.asp 


Ha conEig.asp check admin. asp 


0 


ial ss) order list markl.asp 


1 用， 当 rs order(" 是 
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后 台 订 单 管理 
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main_menu. asp 
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图 9-39 ”未 处 理 客 户 订 单列 表 
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备 户 订单 列表 和 未 处 理 客户 订 早 列 表 是 相对 的 功能 
盏 处 理 ") 的 值 不 等 于 1 时 订单 都 会 显示 在 该 页 面 ， 完 成 后 的 效 末 如 图 
9-39 所 示 。 具 体 的 代码 读者 可 奉 看 光盘 中 的 





设计 的 思路 主要 是 对 编辑 过 的 订单 赋值 
为 已 处 理 订单 和 未 处 理 订单 











product admin 文件 夹 用 于 放置 商品 管理 的 页 面 ， 主 要 包括 了 如 下 9 个 页 面 ， 这 是 购物 © 
系统 的 重点 和 难点 ， 涉 及 到 上 传 图 片 等 高 难 肛 编程 操作 。 











del product.asp: 删除 商品 页 面 。 

insert product.asp: 插入 商品 页 面 。 

product add.asp: 添加 商品 信息 页 面 。 

product list.asp: 后 合 管理 商品 列表 。 

product modify.asp: 更 新 商品 信息 页 面 。 

update product.asp: 建立 上 传 命 令 动态 页 面 。 

upfile.asp: 上 传 文件 测试 动态 页面 。 

upfile.htm: 上 传 图 厂 文 件 议 态 测 试 页 面 。 

upload 5xsoft.inc: 上 传 文件 ASP 命令 模版 。 

搁 术 难度 主要 在 于 图 片 的 上 传 功能 ， 这 9 个 页 面 当中 上 传 文件 测试 动态 页 面 upfile.asp 
和 上 传 图 卢 文 件 毅 态 测试 页 面 upfile.htm 和 本 系统 不 相关 的 页 面 ， 单 独 列 出 是 为 了 说 明 如 何 


上 传 图 片 。 








删除 商品 页 面 del_product.asp 只 是 一 段 删 除 商品 的 动态 页 面 ， 代 码 在 前 面 的 删 
除 功 能 中 经 党 使 用 到 ， 如 图 9-40 所 示 。 


全 D:Acehap09Aadminprodact _adnminvdel_product.asp (XHTML) 


= 回 


[ 源 式 到 】 config.asp check admin. asp 


直る | 松 豆 


る 
2 





回 
トイ 4 
ロ 
ww 





K!--#include file="../../config. asp 一 -> 
“1--#include file="../check_admin. asp "一 -> 
< 
if request("de] productID")<>"" then 

corm.execute("delete * from 产品 表 WHERE 产品 ID="&CInt (request ("del_productID"))) 

corm.execute("delete * from 订单 产品 WHERE 产品 ID="“"&request ("del_productID")&"*") 

if Err. Number?D then 
response. Write“ 对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 姓 再 试 ...” 
response. end 
else 
cormn. close 
set corr=rnothing 
response. redirect “product_list. asp” 

end if 
else 

corm. close 

set corm=nothing 

response. Redirect (request. serverVariables ("Http_REFERER" ) ) 
end if 
闹 > 


2KY1 秒 简体 中 文人 82312) 


9-40 del product.asp 删除 商品 页 面 


具体 的 代码 如 下 : 


く !-- ガ Imclude file="../../config.asp"--> 
<!--#include file="../check admin.asp"--> 


<% 


if request("del productID")<>"" then 
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conn.execute("delete * from 商品 表 WHERE 商品 ID="&CInt(request("del productID"))) 
conn.execute("delete * from 订单 商品 WHERE 商品 ID="&request("del productID")&"") 


if Err.Number>0 then 
response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 …" 
response.end 
else 
conn.close 


set conn=nothing 
response.redirect "product list.asp" 

end if 
else 

conn.close 

set conn=nothing 

response.Redirect(request.serverVariables("Http REFERER")) 
end if 
200> 


插入 商品 页 面 insert product.asp， 是 一 段 插 入 记录 的 代码。 当中 引用 了 
upload Sxsoft.mc 的 程序 代码， 如 图 9-41 所 示 。 


ni い chap09Madmintprodnct_admintinsert_product.asp (XHTML) = 





《1--#imnclude file="../../ config. aSD ーー> 
《1--#include file="../check_admin. asp "一 -> 
《1--#include file="../.. /main_ menu. asD 一 一 > 
“1--#include FILE="upload Sxsoft. inc”——> 
<% OPTION EXPLTCTTW%> 

く %Seryer。 Script TimeOut=5000%> 

<% 

dim upload, file, formlame, formPath, imageName 
imageName="" 

set upload=new upload 5xsoft 


@A config.asp check admin.asp main menu.asp upload 5xsoft.inc 〒 
へ 


ロロ 


し いい 電 時 板 ーー 


“建立 上 传 对 全 ーー 


~ 
” 本 





if upload.form("f ュ 1enath")=““ then ”得 天 上 传 目 孙 
set upload=nothing 

response. end 

else 

formPath=upload. form (“filepath") 

“三 目录 后 加 i 

if right (formPath, 1)<>"/" then formPath=formPaths"/" 
end 1f 


に つ 


嘆 記 | 隔 層 MM | ま | 





for each formName in Upload. objFile ”“ 列 出 所 有 上 伟 
set file=upload. file (formName) ”生成 一 个 芯 忻 对 备 
if file.FileSize>0 then 如 果 FileSize >0 说 明 有 文件 数据 

file. Saveas Server.mnappath(formPathé&file. FileNlame}) 


response. write file.FilePFathifile.FileNamet ZE 』 "formPFathsFile. FileNames 


< 
|¢ 





1K ア 1 秒 簡体 中 立 (GB2312) 





图 9-41 insert product.asp 插入 商品 页 面 


有 具体 的 代码 如 下 : 


<!--#include file="../../config.asp"--> 
<!--#include file="../check admin.asp"--> 
<!--#include file="../../main menu.asp"--> 
<!--#include FILE="upload Sxsoft.inc"--> 
<%'OPTION EXPLICIT%> 
<%Server.ScriptTimeOut=5000%> 

<% 


dim upload,file,formName,formPath,imageName 











第 9 章 cE 民生 





imageName="" 
set upload=new upload Sxsoft "建立 上 传 对 象 
if upload.form("filepath")="" then "得 到 上 传 目 录 
set upload=nothing 
response.end 
else 
formPath=upload.form("filepath") 
"在 目录 后 加 (/) 
if right(formPath,1)< テ リル then formPath=formPath&"/" 
end if 
for each formName in upload.objFile " 列 出 所 有 上 传 了 的 文件 
set file=upload.file(formName) "生成 一 不 文件 対象 
if file.FileSize>0 then "如果 FileSize >0 说 明 有 文件 数据 
file.SaveAs Server.mappath(formPath&file.FileName) "保存 文件 
'response. write file.FilePath&file.FileName&" ("&file.FileSize&") => "&formPath&File.FileName&" 
成功 !<br>" 
ImageName=File.FileName 
end if 
set file=nothing 
next 
"删除 此 对 象 
'sub HtmEnd(Msg) 
' set upload=nothing 
'response. write "<br>"&Msg&" [<a href=""javascript:history.back();""> 返 回 </a>]</body></html>" 
'response.end 
'end sub 
'for each formName in upload.objForm " 列 出 所 有 form 数据 
' response.write "pro_chandi="&upload.form("pro_chand")&"<br>" 
mext 
00>> 
<% 
if upload.form("pro mingcheng")<>"" then 
pro mingcheng=upload.form("pro_ mingcheng") 
pro_ genmu=upload.form("pro genmu") 
pro_ zimu=upload.form("pro zimu") 
pro_bianma=CStr(upload.form("pro bianma")) 
pro_tiaoxingma=upload.form("pro_tiaoxingma") 
pro Jiage=upload.form("pro jiage") 
pro_chandi=upload.form("pro_chandi") 
pro_danwei=upload.form("pro_danwei") 
pro_guige=upload.form("pro_guige") 
pro zaljia=upload.form("pro_ zaljia") 
pro _tuijian=upload.form("pro_tuijian") 
pro_shuoming=upload.form("pro_shuoming") 
conn.execute("insert into 产品 表 ( 商 上 品名 称 ,商品 编码 ,条 公 , 零 售 价 , 产 地 ,单位 ,规格 ,产品 
图 片 , 子 类 别 DD, 根 美 別 ID, 在 架 状 态 ,主页 推荐 ,商品 说 明 ) values ("&pro mingcheng&", 
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"pro_blanmaw", "pro tiaoxingma&","&pro_ jiage&","&pro chandi&","&pro_ danwelk "pro _ 
guige&","&imageName&","&pro zimu&","&pro genmu&","&pro zaljia&","&pro tuijian&","&p 
ro_shuoming&"")") 
end if 
if Err.Number>0 then 
response.write "对 不 起 ， 数 据 库 处 理 有 错误 ， 请 稍 候 再 试 …" 
response.end 
else 
conn.close 
set conn=nothing 
set upload=nothing 
response.Redirect( "product add.asp?return ip 个 添加 产品 信息 成 功 ， 请 继续 添加 ! " 
end if 
906> 


添加 商品 信息 页 面 product add.asp 和 用 户 注 册 系 统 的 用 户 信 息 输 入 页 面 卉 不 
多 ， 只 是 多 了 商品 图 片上 传 功能 ， 页 面 中 的 内 容 为 表单 中 建立 相应 的 动态 对 象 。 设 计 的 效果 
如 图 9-42 所 示 。 


中 | D: chap03%adminiproduct_adminiproduct_add. asp = Ia 








config. asp check admin. asp main menu. asp index. css 
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9-42 ”设计 的 添加 商品 信息 页 面 


product list.asp 后 台 管 理 商品 列表 建立 。 该 页 面 完 成 后 的 效果 如 图 9-43 所 示 。 
页 面 中 列 出 了 商品 的 一 些 信息 比如 是 否 有 图 片 ， 商 品 价格 等 信息 ， 主 要 是 后 面 的 “修改 ”及 
“删除 ”功能 ， 通 过 单 击 “ 人 修改” 命令 可 打开 更 狐 商品 信息 页 面 product modifyasp 进行 商品 
更新 。 
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图 9-43 疫 填 完成 的 后 台 管理 商品 列表 


5) 更 新 商品 信息 页 面 product modifyasp 的 设计 同 新 闻 系 统 中 的 更 新 新 闻 功 能 类 
似 。 设 计 方法 略 ， 读 者 可 以 打开 光盘 中 的 源 代码 进行 学 习 参 考 。 完 成 后 的 设计 效果 如 图 9-44 
所 示 。 
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图 9-44 更 新 商品 信息 


Me)】 单 击 更 新 商品 信息 页 rode nod a 中 的 “提交 ”按钮 ， 可 通过 
update product.asp 建立 上 传 命令 动态 页 面 实现 。 访 动态 页 面 的 功能 命令 和 insert product.asp 
插入 商品 页 面 关 似 ， 难 点 在 于 图 片 的 上 传 更 新 。 访 者 可 打开 源码 进行 学 习 。 
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关于 upfile.asp 上 传 文件 测试 动态 页 面 、upfile.htm 上 传 图 片 文件 静态 测试 页 
面 、upload_5Sxsoftinc 上 传 文件 ASP 命令 模版 3 个 页 面 是 为 了 方便 建立 购物 车 时 单独 调用 ， 
里 面 也 有 详细 的 程序 解释 说 明 ， 在 本 系统 中 不 再 介绍 。 


_Section | 


放下 辅助 页 面 


通过 上 面 几 个 小 节 的 分 析 与 设计 ， 该 网 站 的 在 线 购物 功能 及 后 台 管理 功能 基本 上 已 经 开 
发 完成 ， 但 还 有 很 多 的 说 明 页 面 ， 如 制作 与 购物 相关 的 一 些 说 明 clientasp， 用 来 说 明 售后 服 
务 的 页 面 service.asp， 关 于 企业 的 内 容 从 介 页 面 about us.asp 等 是 需要 由 网 站 拥有 者 根据 实 
际 情况 设计 的 。 网 上 购物 系统 还 要 根据 开发 的 系统 设计 一 个 购物 流程 ， 在 首页 或 者 是 其 他 功 
能 页 面 说 明 购 物 、 结 算 、 售 后 服务 等 详细 的 过 程 ， 这 也 要 根据 实际 的 物流 配送 情况 来 设计 。 

到 这 里 一 个 功能 完善 的 购物 系统 就 开发 完毕 了 ， 通 过 设计 这 个 系统 读者 可 以 掌握 如 何 利 
用 ASP 实现 一 个 购物 车 的 基本 思路 。 
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通过 竞价 排名 很 多 企业 都 切身 感受 到 |] ノ Dir pd 


文件 W) 查看 WV) 控 制 C) 必 助 


了 搜索 引擎 营销 所 带 来 的 好 处 ， 但 其 晶 贵 的 
费用 及 带 来 的 一 些 负面 影响 却 让 很 多 企业 望 | 入 
而 却步 。 其 实 还 有 一 种 成 本 更 低 、 回 报 更 高 | | re 
的 方式 来 开展 搜索 引擎 网 站 营销 ， 这 就 是 搜 | | sw ーー Go i] me 
家 引 党 优 化 《SEO)。 本 吉 训 将 介 组 一 下 SEO | で cs ンー ニン ーー ジー 
方面 的 知识 ， 包 括 SEO 基 础 知识 、 搜 索引 人 擎 

基础 、 如 何 设 计 正 确 的 企业 网 站 SEO 方案 ， 

以 及 选择 企业 关键 词 的 重要 性 等 ， 以 帮助 读 

者 掌握 搜索 引擎 网 站 优化 的 技术 。 


su AA 


关键 字 排 名 查询 工具 E 你 有 多 少 个 站 ? 
查询 某 个 网 址 在 某 个 关键 字 搜 索 结 果 中 的 排名 
(使 用 帮助 @ Ver. 2011-02-22 


相关 工具 : 站 长 工具 箱 。 登 凡 ”排名 上 不 去 吗 ?学 SEO 吧 の 问题 反馈 9 查看 更 新 


EVEL 








教学 重点 


SEO 搜索 引擎 优化 基础 に 
核心 关键 字 策略 に 

网 站 有 效 优 化 方案 に ご 
注重 网 页 级 别 ウ 


ン Dreannweaver CS 


SEO 搜索 引擎 优化 基础 








搜索 引 敬 优化 SEO) 是 一 种 新 兴 的 技术 ， 很 多 人 对 此 疝 不 了 解 。 本 节 将 问讯 者 介绍 
SEO 的 基础 知识 。 


”SEO 基 本 概念 








SEO 的 天 文 全称 为 Search Engine Optimization， 意 思 就 是 搜索 引擎 优化 ， 是 指 通 过 采用 
合理 技术 手段 ， 使 网 站 各 项 基本 要 素 更 适合 搜索 引 获 的 检索 原则 并 且 对 用 户 更 友好 ， 从 而 更 
容易 被 搜索 引擎 收录 及 优先 排序 。 简 单 地 说 ，SEO 就 是 指 通过 总 结 搜 索引 警 的 排名 规律 ， 对 
网 站 进行 合理 优化 ， 使 网 站 在 搜索 引擎 中 的 排名 提高 ， 以 融 来 更 多 的 客户。 























SEO 的 优 缺 点 
SEO 能 在 竞价 排名 的 竞争 中 更 胜 一 筹 ， 受 到 广大 用 户 的 追捧 ， 必 定 有 其 内 在 的 原因 ， 作 为 
主要 的 搜索 引擎 营销 方式 之 一 ，SEO 具备 以 下 特点 。 


SEO 的 优点 : 

(1) 成 本 较 低 : SEO 是 一 种 “免费 ”的 搜索 引擎 香 销 方式 ， 对 于 个 人 网 站 而 言 上 只 要 掌握 
一 定 的 搜索 引 敬 优化 技术 就 可 以 达到 目的 ， 对 于 企业 网 站 而 言 束 要 通过 聘用 专业 的 技术 人 员 
实施 ， 或 者 让 专业 公司 进行 代劳 了 ， 而 即使 如 此 ， 网 站 通过 SEO 维持 一 年 排名 的 费用 ， 通 
第 也 仪 仪 是 做 苋 价 一 到 两 个 月 的 费用 ， 相 比 东 价 要 便宜 很 多 。 























强 ， 所 在 位 置 也 许 数 年 时 间 都 不 会 变动 。 

(3) 不 用 担心 无 效 点 击 : 通过 SEO 技术 优化 的 网 站 排名 效果 比较 稳定 ， 是 自然 排名 ， 
不 会 授 点 击 付费 ， 不 论 您 的 竞争 对 手 如 何 点 ， 都 不 会 给 您 浪费 一 分 钱 。 

(4) 所 有 搜索 引擎 通用 : SEO 技术 最 大 的 好 处 束 是 具有 通用 性 ， 即 使 只 针对 百度 进行 优 
化 ， 但 其 他 的 搜索 引擎 上 的 排名 都 会 相应 的 提高 ， 会 给 您 带 来 更 多 的 有 效 访 问 者 。 

SEO 的 鉄 点 : 

(1) 见效 比较 慢 : 通过 SEO 方式 获得 排名 是 无 法 速成 的 ， 一 般 难 度 的 关键 词 大 约 需 要 
2 一 3 个 月 的 时 间 ， 如 果 难 度 较 大 的 词 则 需要 4 一 $ 个 月 甚至 更 久 ， 建 议 企 业 可 以 在 销售 淡季 
进行 网 站 优化 工作 ， 到 了 销售 旺季 时 排名 也 基本 稳定 了 。 

(2) 排名 的 不 确定 性 : 由 于 搜索 引擎 对 排名 有 各 目的 不 同 规则 ， 有 可 能 在 某 天 某 个 搜索 
引擎 对 排名 规则 进行 了 改变 ， 那 时 也 许 就 会 出 现 原 有 的 排名 位 置 发 生变 动 ， 这 个 是 很 正常 的 
现象 。 

(3) 关键 词 区 分 难 易 程度 : 苋 争 过 于 激烈 的 关键 词 ， 例 如 ; 手 机 、MP3 等 , 用 SEO 方 
式 做 优化 排名 难度 是 很 大 的 ， 这 需要 非常 久 的 时 间 ， 而 且 价 格 也 会 非常 高 昂 ， 所 以 难度 太 大 
的 词 不 适合 做 优化 。 
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(4) 百度 排名 位 置 在 竞价 排名 之 后 : 在 百度 搜索 引擎 里 自然 排名 所 在 的 位 置 只 能 在 竞 
目前 


排名 的 网 站 之 后 ， 如 末 第 一 页 全 部 做 满 了 苋 价 排名 ， 那 卓然 排名 只 能 出 现在 第 二 页 ， 但 
此 种 情况 仅 百 度 存 在 。 

(5) 关键 词 数量 有 限 : 用 SEO 方式 做 网 站 优化 ， 一 个 网 页 推荐 只 做 一 个 关键 词 ， 如 果 
多 的 话 最 好 也 不 超过 3 一 4 个 ， 其 中 1 一 2 个 古 主 词 ， 剩 余 1 一 2 个 是 分 词 ， 无 法 做 到 苋 价 排 
名 那 种 想 做 多 少 做 多 少 的 效 来 。 


”SEO 包 含 工作 


SEO 包含 的 优化 技术 主要 可 分 为 整 站 搜索 引擎 优化 〈 简 称 整 站 优化 ) 与 关键 字 网 页 排名 
优化 (简称 网 页 优化 )。 

1. 网 页 优化 

网 页 优化 是 指 通 过 SEO 技术 对 网 站 内 与 关键 字 相关 的 网 页 进行 优化 、 使 其 单个 网 页 搜 
索引 擎 排名 更 加 靠 前 。 网 页 优化 可 以 根据 指定 的 关键 字 在 各 大 搜索 引擎 上 使 指定 的 网 页 排名 
靠 前 ， 便 于 搜索 者 能 够 轻松 地 找到 此 网 页 信息 ， 目 前 国内 的 搜索 引擎 优化 服务 商 提供 的 基本 
都 是 网 页 优化 服务 ， 根 据 推广 的 关键 字 提 升 网 页 排名 。 

搜索 引擎 优化 (网 页 优化 ) 技术 主要 分 为 两 部 分 : 

(1) 网 页 的 内 部 优化 ， 相 对 单个 网 页 而 言 、 主 要 是 修改 网 页 内 部 的 代码 标签 、 关 键 字 密 
度 、 从 而 增加 其 搜索 引擎 的 友好 性 。 

②) 网 页 的 外 围 优化 ， 对 于 网 页 的 URL 路 径 实行 增加 外 部 链接 〈 别 的 站 点 指向 此 页 面 
的 链接 )、 链 接 文字 为 指定 相关 关键 字 或 者 链接 为 其 他 方式 ， 外 围 优化 可 与 网 页 内 部 优化 相 
协调 使 用 ， 此 项 工作 必须 贯彻 全 过 程 。 

2， 整 站 优化 

整 站 优化 是 指 通过 SEO 技术 使 其 网 站 在 搜索 引擎 中 成 为 一 个 权威 站 点 。 当 整 站 优化 达 
到 预期 效果 时 ， 该 网 站 的 任意 一 个 分 页 面 都 可 以 在 搜索 引擎 中 争夺 热门 关键 字 ， 而 全 站 的 关 
键 字 不 计 其 数 ， 根 据 收录 页 面 数量 来 决定 。 假 设 这 是 一 个 
行业 性 质 站 点 ， 在 做 完整 站 优化 后 很 有 可 能 利用 这 一 个 网 sei 
站 包含 这 个 行业 的 所 有 匹配 关键 字 (其 中 包含 长 尾 关键 字 
等 等 )。 整 站 优化 虽 不 能 保证 某 个 关键 字 的 排名 提升 ， 但 
好 的 整 站 优化 能 够 保证 搜索 引擎 营销 的 整体 效果 。 PPP 

搜索 引擎 优化 〈 整 站 优化 ) 技术 主要 分 为 ; 

(1) 站 内 结构 优化 ， 除 包括 上 述 网 页 内 部 优化 ， 还 包 
括 网 站 程序 修改 、 网 站 内 部 整体 链接 优化 、 用 户 体验 度 优 
化 、 网 站 目录 结构 层次 规划 优化 、 网 站 地 图 制作 。 效果 分 析 

(2) 搜索 评级 优化 ， 对 于 网 站 首选 域名 增加 大 量 的 、 
高 质量 的 、 针 对 性 强 的 外 部 链接 ， 而 站 首页 不 争夺 任何 关 
键 字 ， 仅 仅 保 存 网 站 品牌 名 称 。 

网 站 优化 的 主要 工作 流程 如 图 10-1 所 示 : 







































































网 站 内 部 结构 调整 
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核 心 关键 字 字 筑 四 





要 对 网 站 进行 优化 ， 首 先 要 确认 一 下 推广 网 站 页 面 押 选择 的 关键 池 ， 然 后 围绕 关键 字 开 
一 系列 的 优化 工作 ， 以 提高 负面 在 相关 关键 子 搜索 结 来 中 的 排名 。 本 小 市 重点 介绍 关于 关 
nt 些 知 识 。 


1021 


根据 潜在 客户 或 目标 用 户 在 搜索 引擎 中 找到 你 的 网 站 时 输入 的 语句 ， 产 生 了 天 键 子 
(Keywords) 的 概念 ， 这 不 仅 是 搜索 引擎 优化 的 核心 ， 也 是 整个 搜索 引擎 理 销 都 必须 围 经 的 核 
心 。 首 先 要 确定 推广 的 核心 天 键 字 ， 再 围 经 核心 关键 字 进行 排列 组 合 产生 关键 词组 或 短 人 句 。 

合 看 关键 字 的 方法 : 在 浏览 器 中 打开 目标 网 页 ， 点 击 来 单 栏 上 的 “ 答 看 ”一 “ 源 文 
件 ” 一 “<meta name="keywords" conten 全 ”后面 的 文字 即 该 网 站 关键 字 ， 10-2 所 示 的 是 
一 家 婚纱 企业 网 站 的 关键 学 。 


四 sww.jadebrida1[1] - 记事 本 周回 
文件 W) 编辑 不 ) 格式 (0) 查看 WW) 和 帮助 00) 

<*DOCTYPE html PUBLIC "ーー ア ア M3E/ ア DTD XHTHL 1.8 Transitional//EN" 

"httD :/ ア Wu.W3 -0F ロ /TR/xhtm117DTD/xhtm11-trans1tiona1 .dtd""> 

く htm1 xmlns="http: 474wuy.u3 0FH/1999/ghtm1"> 

く head> 

く meta http- equiv= "Content-Tuype'" content="text#html; charset=utf-8" ‘> 

<meta name= "keyword conte HR 

















、 个 UL 
、bridal gowns、bridalwear、eveningwear Fide、 ]ade bridal、bridal、exclusiue、femail、 
beijing、 a london、paris、milan、wedding、wedding dress,china,dress,evening 
二 :gouns 
name="description" content= 全休 i 婚纱 定做 、 、 北京 全 
J 婚纱 、 礼 服 ， re , He 旨 纱 、 高 级 定做 、 高 级 1 婚纱 礼 
Ci 起 の 中 国 婚 纱 、 中 国 婚 3 拉 め 设计 、 娘 纱 饥 计 半 、 尋 録 礼服 、 尋 録 礼服 
札 』 县 计 响 、 bridesmaids、 TH owns、 bridalwear、 eueningwear、 Bride、 jade 
pia 4 MT femail、 beijing、newyork、london、paris、milan、wedding、wedding 
dress,china,dress,evening dress,gowns"> 
<LINK href="cssi1css.css"" type=textjcss 
rel=stylesheet><LINK href="css/icss.css" type=text/css rel=stylesheet> 
<title>jadewen</title> 
く stu1e type="'text/css"> 
くき ーー 





图 10-2 查看 关键 学 的 方法 


和 2 者 克 择 天 键 子 


对 企业 、 商 家 而 言 ， 核 心 关键 学 就 是 他 们 的 经 营 范 围 ， 如 产品 、 服 务 名 称 、 行 业 定位 ， 
以 及 企业 名 称 或 品牌 名 称 和 等。 选择 关键 学 时 应 该 注意 如 下 一 些 常识 。 

(1) 从 客户 的 角度 考虑 : 潜在 客户 在 搜索 你 的 产品 时 将 使 用 什么 关键 字 ? 这 可 以 从 众多 
资源 中 获得 反馈 ， 例 如 从 你 的 客户 、 供 应 商 、 品 牌 经 理 和 销售 人 员 那 里 获知 其 想法 。 

(2) 将 关键 字 扩 展 成 一 系列 词组 和 短语 : 尽量 不 要 用 单一 词汇 ， 而 是 在 单一 词汇 基础 上 
进行 扩展 ， 如 : 服 帮 一 流行 服 猴 一 时 尚 流行 服 猴 。 百 上 度 关 键 字 工 具 可 以 查询 特定 关键 字 的 第 
见 答 询 、 扩 展 匹配 及 奏 询 热度 ， 最 好 的 关键 字 是 那些 没有 被 广泛 使 用 而 又 很 多 人 搜索 的 字 。 

(3) 进行 多 重 排列 组 合 : 例如 ， 改 变 短 语 中 的 字 序 以 创建 不 同 的 词语 组 合 ;使 用 不 党 用 
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的 组 合 ; 组 合成 一 个 问 句 ， 包 含 同 义 词 、 蕉 换 词 、 比 喻 词 和 常见 错 拼 词 的 组 合 ， 包含 所 卖 产 
品 的 商标 名 和 品名 的 组 合 ; 使 用 其 他 限定 词 来 创建 更 多 的 两 子 组 合 ， 三 学、 四 和子 组 合 。 

(4) 不 要 用 意义 太 泛 的 关键 学 : 如 朱 从 事 服 闭 设 备 制 造 ， 则 选择 “设备 ”作为 你 的 核心 
天 键 字 融 无 益 于 吸引 到 目标 客户 。 实 际 上 ， 为 了 准确 找到 需要 的 信息 ， 搜 索 用 户 倾 回 使 用 具 > 
体 词 汇 及 组 合 寻 找 信 息 〈 尤 其 是 两 词组 合 )， 而 不 是 使 用 那些 大 而 沁 的 概念 。 此 外 ， 使 用 意 
义 太 三 的 关键 池 ， 也 意味 看 你 的 网 站 要 跟 更 多 的 网 站 竞争 排名 ， 上 胜出 的 难度 更 大 。 

(5) 用 目 己 的 品牌 做 关键 衬 : 如 有 果 是 知名 企业 ， 则 别 款 了 在 关键 字 中 使 用 公司 名 或 产品 
品牌 名 称 。 但 如 果 不 是 知名 的 品牌 ， 则 宜 以 企业 要 销售 的 产品 对 象 名 称 作为 关键 字 。 如 使 用 
“流行 服 半 ”了 束 要 远 远 比 东 品牌 的 服 靖 强 的 多 ， 因 为 没有 人 知道 东 铝 牌 是 做 什么 的 ， 更 不 会 
去 搜索 这 个 关键 字 。 

(6) 适当 使 用 地 理 位 置 : 地 理 位 置 对 于 经 营地 方 性 业务 的 企业 尤其 重要 。 如 有 果 业 务 范围 
以 本 地 为 主 ， 则 在 关键 字 组 合 中 加 上 地 区 名 称 如 “北京 广告 创意 ”。 

(7) 参考 竞争 者 使 用 的 关键 字 : 碍 询 葛 争 者 的 关键 字 可 让 用 户 想 到 一 些 可 能 漏 拯 的 词 
组 。 但 不 要 照抄 任何 人 的 关键 子 ， 因 为 并 不 消 楚 他 们 为 何 要 使 用 这 些 关 键 子 一 一 你 得 目 己 想 
关键 字 。 参 考 别 人 的 关键 字 只 是 对 你 已 经 选 好 的 关键 字 进 行 补充 。 

(8) 不 用 无 关 的 关键 字 : 有 些 网 站 将 热门 的 词汇 列 入 目 己 的 关键 学 中， 尽管 这 个 热门 天 
键 字 跟 目 己 网 站 内 容 坚 不 相干 。 甚 全 有 人 把 竞争 对 手 的 品牌 也 加 入 到 目 己 的 关键 季 中 ， 这 是 
侵权 的 行为 。 由 于 这 些 所 请 “热门 ”词汇 并 未 在 网 站 内 容 中 出 现 ， 因 此 对 排名 并 无 实质 性 大 
助 ， 过 多 的 虚假 关键 字 还 可 能 受到 处 因 、 降 低 排 名 。 

(9) 适当 控制 关键 字数 量 ; 一 页 中 的 关键 字 最 多 不 要 超过 3 个 ， 而 所 有 内 容 都 应 针对 这 
几 个 核心 关键 字 展开 ， 这 样 才 能 你 证 关键 季 密 上 度 合 理 ， 搜 索引 擎 也 会 认为 该 页 主题 明确 。 如 
朱 确 实 有 大 量 关 键 字 需 要 呈现 ， 可 以 分 艇 写 在 其 他 页 面 并 进行 针对 性 优化 ， 这 也 十 为 什么 衣 
页 和 内 页 的 关键 字 往 往 要 有 上 所 区 别 的 原因 。 


“关键 字 密度 


在 确定 了 要 采用 的 关键 字 之 后 ， 需 要 在 网 页 文本 中 适当 出 现 这 些 关 键 字 。 关 键 字 在 网 页 
中 出 现 的 频次 ， 即 关键 字 密 度 (Keyword Density) ， 就 是 在 一 个 页 面 中 ， 占 所 有 该 页 面 中 总 
的 文字 的 比例 ， 访 指标 对 搜索 引擎 的 优化 效果 起 到 重要 的 作用 。 

天 鍵 字 密 度 的 算法 : 

关键 字 密 上 度 三 关键 学 词 频 /网 页 总 词汇 量 

公式 中 总 词汇 是 指 页 面 程序 标签 ( 如 HIML 标签 及 ASP、JSP、PHP 等 ) 以 外 的 所 有 词 
汇 的 数量 。 

中 文 关 键 字 密度 一 般 在 6% 一 8% 较为 合适 。 切 忌 进 行 关键 字 堆 砌 ， 即 一 页 中 关键 字 的 
出 现 不 是 根据 内 容 的 需要 安排 ， 而 是 为 了 讨好 搜索 引擎 人 为 堆积 天 键 了 学 。 这 已 经 被 搜索 引擎 
归 入 恶意 行为 ， 有 得 到 惩罚 的 风险 。 
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则 是 以 目 上 而 下 、 从 左 到 右 的 顺序 进行 。 下 面 我 们 就 介绍 一 下 关键 学 在 其 体 的 网 页 中 如 何 分 
布 是 最 有 效 的 。 

(1) 网 页 代码 中 的 Tite，META 标签 (关键 学 keywords 和 摘 述 description) 如 上 面 
举例 的 关键 字 分 布 : 

<meta name="keywords" content=" 姬 纱 专 卖 、 礼 服 专卖 、 婚 纱 礼服 专卖 、 晚 礼服 专 腾 、 
局 级 定制 、 礼 服 定 做 、 礼 服 定做 、 婚 纱 定做 、 婚 纱 定做 、 北 京 礼服 、 狐 女 礼 服 、 狐 女 婚 纱 、 
婚纱 、 礼 服 、 定 做 婚纱 礼服 、 定 做 婚纱 礼服 、 北 京 婚纱 、 高 级 定做 、 高 级 定做 婚纱 礼服 、 晚 
礼服 、 婚 纱 用 品 、 北 京 婚纱 礼服 、 中 国 婚纱 、 中 国 婚纱 网 、 婚 纱 设 计 、 婚 纱 设计 网 、 婚 纱 礼 
服 、 婚 纱 礼服 网 、 礼 服 设计 、 礼 服 设 计 网 、bridesmaids、bridal gowns 、 bridalwear 、 
eveningwear 、 Bride 、 jade bridal、 bridal、 exclusive 、 femail 、 be1jing 、newyork 、 london 、 











paris、milan、wedding、 wedding dress,china,dress,evening dress,gowns"> 

<meta name="description" content=" 礼 服 定做 、 礼 服 定做 、 婚 纱 定做 、 婚 纱 定做 、 北 京 礼 
服 、 新 女 礼 服 、 新 尹 婚纱、 婚纱、 礼服、 定做 婚纱 礼服 、 定 做 婚纱 礼服 、 北 各 婚纱 、 蜗 级 害 
做 、 蜗 级 定做 婚纱 礼服 、 瞳 礼服 、 婚 纱 用 品 、 北 各 婚纱 礼服 、 中 国 婚纱 、 中 国 婚纱 网 、 婚 纱 
设计 、 婚 纱 设 计 网 、 婚 纱 礼服 、 婚 纱 礼服 网 、 礼 服 设 计 、 礼 服 设计 网 、 bridesmaids、bridal 
gowns 、 bridalwear 、 eveningwear 、 Bride 、 jade bridal、 bridal、 exclusive 、 femail、 beijing、 





newyork、london、parlis、milan、 wedding、wedding dress,china,dress,evening dress,gowns"> 

(2) 网 页 正文 最 吸引 注意 力 的 地 方 : 正文 内 容 必 须 适 当 出 现 关 键 子 ， 并 且 “ 有 所 侧 
重 ”， 总 指 用 户 阅 读 习 惯 形成 的 阅读 优先 位 苟 按 从 上 到 下 、 从 左 至 右 成 为 天 键 词 重点 分 布 位 
四， 包括 : 页 面 徘 项 部 、 左 侧 、 标 题 、 正 文 前 200 和 社 以 内 。 在 这 些 地 方 出 现 关 键 字 对 排名 
更 有 帮助 。 

(3) 超 链接 文本 〈 锚 文本 ): 除了 在 导航 、 网 站 地 图 、 锚 文本 中 有 意识 使 用 关键 字 ， 还 
可 以 人 为 增加 超 链 接 文 本 。 如 一 个 章 痛 厂商 网 站 可 以 通过 加 上 以 下 行业 资源 : 中 国 章 装 阿 、 
流行 草 装 网 ……… 含有 “ 章 狼 ”文学 的 链接 来 达到 增加 超 链 接 文 本 的 日 的 。 这 也 值得 网 站 在 
添加 友情 链接 时 做 参考 ， 即 链接 对 象 中 最 好 包含 有 关键 学 或 相关 语义 的 网 站 。 

(4) Header 标签 : 即 正文 标题 <Hl><HIA> 中 的 文学 。 搜 索引 擎 比较 重视 标题 行 中 的 文 
字 。 用 <b></b> 加 粗 的 文学 往往 也 是 关键 学 出 现 的 地 方 。 

(5) 图 厂 Alt 属性 : 搜索 引擎 不 能 抓 取 图 厂 ， 因 此 网 页 制作 时 在 图 三 属性 Alt 中 加 入 关 
键 学 是 对 搜索 引擎 优化 的 好 办 法 ， 它 会 认为 该 图 请 内 容 与 你 的 关键 字 一 致 ， 从 而 有 利于 排名 。 

一 般 的 网 页 设计 都 由 网 页 设计 师 守成。 设计 师 设 计 网 站 往往 仅 从 美观 、 创 意 和 易 用 的 角 
度 考 虑 ， 这 对 于 一 个 期 望 在 搜索 引擎 中 排名 优 夯 的 两 业 网 站 来 说 ， 已 经 远 远 不 够 了 ， 网 站 策 
划 人 员 至 少 应 该 为 设计 师 制 定 一 份 需求 备 生 了 水 ， 提 醒 在 设计 中 需要 配合 和 注意 的 环节 。 


关键 字 评 估 


经 过 关键 字 的 寻找 及 用 户 搜 索 习 惯 分 析 后 ， 确 定 了 相应 的 关键 学 。 在 开始 使 用 关键 字 时 
还 要 对 其 进行 一 下 评 倍 ， 包 括 关 键 字 的 “搜索 量 ”“ 商 业 价 值 ””“ 苋 争 程序 ”， 再 从 中 入 选 
出 局 搜索 量 、 局 相关 性 、 低 竞争 的 关键 子 。 

1. 搜索 量 的 评估 

搜索 量 束 是 指 关键 学 在 某 个 搜索 引擎 网 站 上 的 搜索 量 ， 利 用 搜索 引擎 提 供 的 相关 工具 即 
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可 以 实现 评估 ， 在 光盘 中 source 文件 下 chap10 是 一 个 关键 字符 询 的 工具 。 
(1) 双击 运行 后 打开 其 主 界 面 如 网 10-3 所 示 。 


A adobe Flash Player 9 
立件 (ば ) 查看 0 控制 你 ) 帮助 





关键 字 排 名 查询 工具 你 有 多 少 个 站 ? 


查询 某 个 网 址 在 某 个 关键 字 搜索 结果 中 的 排名 
( 旭 使 用 帮助 入 Ver. 2011-02-22 


一 查询 范围 (页 ) 一 


网 址 | 因 [所 相遇 |] 1 [| 什 -|10 HH (四 句 
NCE 
关键 字 ~ | | と | | 和 查询 | 倍增 向 | 密度 


选择 搜索 引擎 IM Baidu IV| Google IM YahoolM soso IM] bing IJ SogoulM youdao IM 选择 所 有 








车 终身 免费 的 博客 群发 软件 ， 立 即 下 载 * 次 虫 虫 SE0 软 件 【 博 客 z2009】3. 15 特 价 活动 鞠 有 意 投放 广告 请 联系 g9:68050871 





相关 工具 : 站 长 工具 箱 ” 贸易” 排名 上 不 去 吗 ? 学 SEO 吧 2 问题 反馈 9 查看 更 新 








图 10-3 ”关键 字 查 询 工 具 


(2) 单 击 面板 上 的 “相关 关键 字 查 询 ” 链 接 ， 打 开 “ 相 关 关 键 字 查询 ”对 话 框 ， 在 “ 关 
键 字 ” 文 本 框 中 输入 需要 碍 询 的 关键 字 如 “服装 ”， 单 击 选择 “搜索 引擎 ” 复 选 框 
“Baidu”， 即 表示 在 百度 上 查询 ， 设 置 如 图 10-4 所 示 。 


A Adobe Flash Player 9 周回 四 
文件 中) 查看 上) 控制 已) 希有 


关键 字 排名 查询 工具 四 加 你 怕 什 么 


查询 某 个 网 址 在 某 个 关键 字 搜 索 结果 中 的 排名 
ゆ 使 用 帮助 軸 Ver 2011-02-22 











相关 关键 字 坦 询 输入 需要 查询 的 关键 字 ， 每 次 查询 一 个 关键 字 


关键 字 | 服装 | 必須 包含 开始 查询 停止 查询 


搜索 引擎 [VI Baidu | | Google 查询 深度 2 人 ] 级 。 关键 字 长 度 小 于 0 を | 0 表示 不 限制 


车 终身 免费 的 博客 群发 软件 ， 立 即 下 载 * 次 虫 虫 sE0 软 件 【 博 客 2009】3. 15 特 价 活动 车 有 意 投放 广告 请 联系 99:6050671 


欢迎 使 用 相关 关键 字 查 询 功 能 


【相关 关键 字 查询 】 功 能 可 以 快速 查询 一 个 关键 字 在 百度 ,Google 结果 中 的 相关 关键 字 
可 以 设置 查询 深度 、 包 含 关键 字 、 关 键 字 长 度 等 参数 


查询 快速 、 多 种 设置 、 详 细 报 表 


コー ニラ ーー ドー ーー = 一 = 一 


相关 工具 : 站 长 工具 箱 村 园 | 相 尝 吕 言 可 的 cndtT5 の 门 三 反馈 (0) 查看 更 新 





10-4 ”关键 子 碍 询 设 首 


(3) 单 击 “ 开 始 碍 询 ” 按 钮 ， 和 等 片刻 即 可 以 得 出 相关 的 关键 季 在 百 度 上 的 收录 情况 ， 
从 收录 数量 即 可 以 判断 应 该 选择 什么 样 的 关键 子 了 。 如 图 10-$ 所 示 。 
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A 』dobe Flash Player 9 
文件 W) 查看 (WY) 控 制 C) 帮助 


关键 字 排 名 查询 工具 加 昨 弄 的 啊 ? 
查询 某 个 网 址 在 某 个 关键 字 搜 索 结 果 中 的 排名 
(如 使 用 帮助 @ Ver. 2011-02-22 


相关 关键 字 查 询 输入 需要 查询 的 关键 字 ， 每 次 查询 一 个 关键 字 





关键 字 服装 必须 包含 开始 查询 停止 查询 


搜索 引擎 [VI Baidu 口 Google 查询 深度 2 - 人 | 级 。 关键 字 长 度 小 于 0 を | 0 表示 不 限 制 


$ ょ 3 + SO 2009】 3.15 に :60506T1 
葛 终身 免费 的 博客 群发 软件 ， 立即 下 载 * 鞠 虫 虫 SE0 软 件 【 博 客 2009】3. 15 特 价 活动 芝 有 意 投放 广告 请 联系 99:6050671 


提示 : 点 击 【 收 录 数 最 】 可 进行 排序 ， 如 结果 为 0 可 能 无 相关 关键 字 或 查询 被 搜索 引擎 屏 车 导出 查询 结果 
と コ 


序号 | 关键 字 

服装 论坛 

儿童 服装 

服装 批发 

服装 设计 
服装 租赁 东方 美 租赁 
服装 搭配 

9 元 韩版 服饰 


索引 擎 深度 收录 数量 

1 14500000 
6240000 
42300000 
51300000 
45900 


中 | 中 | 中 | 中 | 中 | 中 | 中 | 涝 
o.oo.|v. 
lalals 
こ ご | ご | に | に | に | に | に 


27700000 
2320000 





相关 工具 : 站 长 工具 箱 等 多。 起 学 习 高 超 的 5eo 技 巧 么 ? W み 问题 反馈 @ 查看 更 新 


图 10-$ 查询 结果 





网 站 有 效 优 化 方案 


前 面 已 经 介绍 过 网 站 优化 包含 的 工作 内 容 ， 这 一 小 节 就 详细 介绍 一 下 具体 的 优化 方 守 ， 
主要 包括 网 页 的 外 围 优 化 ， 内 部 细 市 优化 以 及 链接 优化 策略 。 


1 网 页 外 围 优化 


外 围 的 优化 主要 是 指 基于 URL 链接) 的 优化 ，URL 是 统一 资源 定位 ， 即 每 个 网 页 的 
网 址 、 路 径 。 网 站 文件 的 目录 结构 直接 体现 于 URL。 清 晰 简短 的 目录 结构 和 规范 的 命名 有 
利于 用 户 体验 和 网 址 传播 。 

1. 目录 层次 优化 

小 型 网 站 一 般 只 有 一 层 子 目录 如 http://www.hbculture.com/dir/page.htm， 其 中 http://www. 
hbculture.com 是 域名 ，dir 是 一 级 目录 名 ，pasge 是 文件 名 。 对 搜索 引擎 而 言 ， 这 种 单一 的 目 
录 结 构 最 为 理想 ， 即 局 平 结构 《Flat)。 而 规模 大 的 网 站 ， 需 要 2 一 3 层 子 目录 : http://www. 
hbculture.comy/dirdirl/dir2/page.htm。 搜 索引 擎 还 是 会 去 抓 取 2 一 3 层 子 目录 下 的 文件 ， 但 最 
好 不 要 超过 3 层 ， 如 果 超 过 3 层 ， 搜 索引 擎 就 很 难 去 搜索 它 了 。 当 然 如 果 有 以 下 的 情况 ， 即 
使 深入 第 4 层 甚 至 更 深层 的 页 面 ， 也 同样 能 被 搜索 到 : 

(1) 如 条 访 页 提供 了 重要 内 容 ， 有 大 量 来 目 其 他 网 站 的 外 部 链接 〈Inbound Links ); 

(2) 如果 在 首页 上 增加 一 个 该 页 的 链接 ， 可 以 通过 首页 直接 到 达 ; 

(3) 如果 有 其 他 网 站 在 顶级 页 面 上 链接 了 该 页 ， 其 效果 就 好 似 你 在 目 己 的 首页 上 做 了 议 
链接 。 

2. 目录 和 文件 命名 优化 

根据 关键 字 无 所 不 在 的 原则 ， 可 以 在 目录 名 称 和 文件 名 称 中 使 用 到 关键 字 。 但 如 果 是 关 
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键 词组 ， 则 需要 用 分 隅 人 符 分 开 。 和 用 连 字 符 “-” 和 下 划 线 ” ”进行 分 隔 ，URL 中 还 经 津 
出 现 衬 格 码 “%20”。 如 采 以 “ 环 博 制造 ”作文 件 名 ， 可 能 出 现 以 下 三 种 分 隔 形式 : 
made-in-huanbo.htm 

made in huanbo.htm > 

made%20in%20 huanbo.htm 

但 事实 上 ， 人 至 少 在 目前 Google 并 不 认同 “ ”为 分 隔 从 。 对 Google 来 说 ， made-in- 
huanbo 和 made%20in%20 huanbo 都 等 于 made in huanbo, 但 made im huanbo 就 被 磁 成 了 
madein huanbo， 连 在 一 起 之 后 ， 天 键 字 下 失 去 了 和 意义。 因此， 目录 和 文件 名 称 如 末 有 关键 词 
组 ， 要 用 连 字 符 “-” 而 不 是 下 划 线 “ ”进行 分 隅 。 

URL 应 该 越 短 越 好 。 有 人 为 了 单纯 增加 关键 字 而 额外 建 多 一 个 市 有 关键 字 的 子 目录 ， 
改变 目录 结构 。 由 于 URL 中 含有 关键 字 本 喘 对 排名 提高 帮助 并 不 大 ， 因 此 这 种 做 法 多 此 一 
举 ， 这 也 是 搜索 引擎 反感 的 。 

3. 绝对 URL 和 相对 URL 

绝对 URL 即 网 员 路 径 使 用 包含 项 级 域名 在 内 的 完整 的 URL。 如 : www.hbculture.com/ 
page/index.html 是 一 个 绝对 路 径 ， 其 中 /age/index.html 则 为 相对 路 径 ， 由 浏览 器 上 自动 在 该 链 
接 前 加 上 http:/www.hbculture.com/。 总 体 上 Google 在 排名 时 并 不 在 意 URL 使 用 的 是 相对 
路 径 还 是 绝对 路 径 。 

目前 很 多 网 站 都 有 数据 库 张 动 生 成 的 URL， 即 动态 URL， 人 往往 表现 为 在 URL 中 出現 
“= 人“% ”以 及 “&”、“$ ”等 学 待 。 动 态 URL 极 不 利于 搜索 引擎 抓 取 网 页 ， 严 重 影 啊 
网 站 排名 ， 通 利 是 通过 拉 术 解决 方案 将 动态 URL 转化 成 静态 的 URL 形式 , 如 : 

将 http://www.hbculture.com/news.php?id=1&type=3 

转化 为 http://www.hbculture.com/news/1/3/ 

导航 结构 优化 

一 个 好 的 网 站 导航 是 对 引导 用 户 访问 网 站 的 栏目 、 球 单 、 在 线 帮 助 、 布 局 结构 等 形式 的 
统称 。 其 主要 功能 在 于 引导 用 户 方便 地 访问 网 站 内 容 ， 是 评 佑 网 站 专业 度 、 可 用 上 度 的 重要 指 
标 。 概 括 地 讲 ， 网 站 在 导航 方面 应 注意 以 下 几 点 。 

(1) 主导 航 导 回 清 晰 : 通 音 主导 舱 为 一 级 目录 ， 通 过 它们 用 户 和 映 蛛 程序 都 可 以 层 层 深 
入 访问 到 网 站 所 有 重要 和 内容。 因此 主导 航 必 须 在 网 站 首页 第 一 屏 的 醒目 位 置 体 现 ， 并 最 好 采 
用 文本 链接 有 的 方式 而 不 是 使 用 图 厂 链 接 。 

(2) 展开 式 导 问 路 径 : 所 谓 “ 展 开 式 导向 ”是 比喻 用 户 通 过 主导 般 到 目标 网 页 的 访问 过 
程 中 的 路 径 提 示 ， 使 用 户 了 解 押 处 网 站 中 的 位 置 而 不 至 于 迷失 “方向 ” 并 方便 回 到 上 级 页 
面 和 起 点 。 路 径 中 的 每 个 栏目 最 好 诬 加 链接 。 

如 下 : 

环 博 文化 : 首页 > 最 新 独 闻 > 最 新 报 道 

即使 没有 详细 的 路 径 来 源 ， 也 至 少 应 该 在 每 个 子 页 面 提 示 回 首页 的 链接 ， 包 括 使 用 页 面 
的 Logo 作 链 接 。 

(3) 重要 内 容 要 突出 : 除了 主导 航 ， 还 应 该 将 次 级 目录 中 的 重要 内 容 以 链接 的 方式 在 首 
页 或 其 他 子 页 中 多 次 呈现 ， 以 突出 重点 。 搜 索引 擎 会 对 这 种 一 站 内 多 次 出 现 的 链接 给 予 充 分 
重视 ， 对 网 页 级 别 〈PageRank) 提高 有 很 大 帮助 ， 这 也 是 每 个 网 站 站 页 的 网 页 级 别 一 般 珊 于 
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其 他 页 面 级 别 的 重要 因 妹 ， 因 为 每 个 子 页 都 对 首页 进行 了 链接 。 

(4) 使 用 网 站 地 图 : 网 站 地 图 是 辅助 导航 的 手段 ， 最 初 是 为 用 户 设 计 的 ， 以 方便 用 户 快 
捷 到 达 目 标 页 。 民 好 的 网 站 地 图 币 间 以 网 站 拓扑 结构 体现 复杂 的 目录 关系 ， 具 有 静态 、 下 
观 、 局 平 、 简 单 的 特点 。 网 站 地 图 多 采用 文本 链接 ， 不 用 或 少 用 修饰 性 图 乒 ， 以 加 快 页 面 加 
载 速度 。 以 上 特 氮 符合 搜索 引擎 优化 的 要 求 ， 因 此 网 站 地 图 在 SEO 中 也 有 重要 的 意义 。 在 
网 站 地 图 中 进行 文本 链接 ， 可 在 一 定 程度 上 弥补 蜂 蛛 程序 无 法 识别 图 片 和 动态 网 页 造成 的 不 
足 。 网 站 地 图 也 要 突出 重点 ， 尽 量 给 出 主干 性 内 容 及 链接 ， 而 不 是 提供 所 有 细 校 末世 。 一 页 
内 不 适宜 放 太 多 链接 。 

5. 图 像 优化 

正 关 情况 下 搜索 引擎 只 识 读 文 本 内 容 ， 对 图 像 是 不 可 见 的 。 同 时 ， 图 像 文件 会 直接 延 组 
页 面 加 载 时 间 ， 如 果 超 过 20s 网 站 还 不 能 加 载 打 开 页 面 ， 用 户 和 搜索 引擎 极 有 可 能 离开 你 的 
网 站 。 因 此 ， 除 非 你 的 网 站 内 容 是 以 岁 片 为 主 ， 比 如 游戏 站 点 或 者 图 片 至 关 重 要 ， 人 否则 尽量 
避免 使 用 大 图 片 ， 更 不 要 采用 纯 图 像 制 作 网 页 。 网 站 图 片 优 化 的 核心 有 两 点 : 增加 搜索 引擎 
可 多 的 文本 描述 ， 以 及 在 保持 图 像 质 量 的 情况 下 尽量 压缩 图 像 的 文件 大 小 。 

Alt 属性 : 

每 个 图 像 <IMG> 标 签 中 都 有 Alt 属性 ， 搜 索引 擎 会 恋 取 该 属性 以 了 解 图 像 的 信息 。 
此 ， 最 好 在 所 有 插图 的 Alt 属性 中 都 插入 文学 描述 ， 并 市 上 该 页 关键 子 在 其 中 。 文 本 说 明 ， 
如 图 10-6 所 示 的 図像 属性 面板 中 “ 替 換 ” 后 面 的 文 本 椎 籍 入 的 文 本 即 訪 Alt 属性 。 













































































































































































属性 
ーー 国 像 , 58K 宽 W) 214 源 文件 (5) images/01. jpg 名 六 替 換 ) 新 闻 图 片 v 美 C) 无 中 
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图 10-6 图 像 属 性 面板 


除了 Alt 属性 文字 ， 还 可 以 考虑 以 下 方法 直接 优化 图 像 ， 使 之 被 搜索 到 : 

(1) 在 图 片上 方 或 下 方 加 上 包含 关键 字 的 描述 文本 ; 

(2) 在 代码 中 增加 一 个 包含 关键 字 的 heading 标题 标签 ， 然 后 在 图 片 下 方 增加 文字 描述 ; 

(3) 在 图 片 下 方 或 旁边 增加 如 “更 多 关键 字 ” 链 接 ， 包 含 关键 词 ; 

(4) 创建 一 些 既 吸引 用 户 又 吸引 搜索 引擎 的 文本 内 页 ， 先 把 流量 吸引 到 这 些 页 面 ， 再 提 
供 文 本 链接 指 癌 你 的 图 片 页 面 ; 

(5) 尽 可 能 把 图 片 处 理 成 GIF 网 页 交互 模式 ， 这 样 能 把 图 片 缩小 。 

总 体 上 ， 网 页 应 尽量 减少 装饰 性 图 片 以 及 大 图 片 。 而 Alt 属性 中 的 文字 对 搜索 引擎 来 
说 ， 其 重要 性 比 正文 内 容 中 的 文字 要 低 。 

6. GIF 和 JPGE 图 像 优 化 

Alt 属性 和 文本 说 明 都 只 是 对 图 像 之 外 的 文本 环 场 进 行 优化 ， 下 耐 简 单 谈 谈 对 图 片 本 号 
的 优化 处 理 。 对 图 片 文件 优化 的 目的 是 在 尽量 不 影响 图 像 画 面 效 果 的 前 提 下 ， 将 其 文件 大 小 
降 到 最 低 ， 以 加 快 页 面 整体 下 载 速 度 。 

网 页 图 厂 格 式 主要 有 GIF 和 JPGE 两 种 形式 。 一 般 来 讲 ，GIF 适用 于 线 图 和 企业 标识 ; 
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JPEG 适宜 照片 元 素 的 格式 。 主 要 通过 减少 GIF 颜色 数量 、 缩 小 图 片 尺寸 和 降低 分 辩 率 来 缩 
小 文件 ， 也 可 以 采用 层 例 样式 表达 到 优化 的 目的 。 些 外， 将 大 图 片 切 割 成 知 干 小 图 片 于 不 同 的 
表格 区 间 内 进行 拼接 ， 也 可 以 相对 加 快 下 载 时 间 。 

7. Flash 优 化 

目前 很 多 企业 网 站 为 了 退 求 页 面 的 美观 ， 通 党 都 使 用 Flash 作为 网 站 的 首页 ， 有 的 甚至 
整 站 都 是 使 用 Flash 开 友 而 成 的 ， 如 图 10-7 所 示 。 
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图 10-7 Flash 网 站 


由 于 搜索 引擎 并 不 重视 Flash 文档 ， 在 对 纯 Flash 页 面 进行 优化 时 ， 我 们 可 以 从 以 下 三 
个 方面 来 独 手 进 行 优 化 工作 : 

(1) 首先 做 一 个 辅助 HTML 版本 : 保留 原 有 Flash 版 本 的 同时 ， 还 可 以 设计 一 个 
HTML 格式 的 版 本 ， 这 样 既 可 以 保持 动态 美观 效果 ， 也 可 以 让 搜索 引擎 通过 HTML 版本 的 
网 页 来 发 现 网 站 。 

(2) 其 次 将 Flash 内 骨 HTML 文件 : 还 可 以 通过 改变 网 页 结构 进行 弥补 ， 即 不 要 将 整 
CR a en 这 样 对 于 用 户 浏 览 3 
不 会 前 弱视 觉 效 果 ， 搜 索引 擎 也 可 以 从 HTML 代码 中 发 现 一 些 必要 的 信息 ， 尤 其 是 进入 内 
ie ee ee ne ed pe ta 
文件 之 外 ， 以 独立 纯 文本 链接 的 方式 呈现 。 

(3) 最 后 进行 付费 登录 搜索 引擎 : 如 果 FIash 网 站 搜索 结果 排名 效果 不 太 理 想 ， 可 以 通 

过 付费 登录 或 做 搜索 引擎 关键 字 广 告 ， 同 样 被 用 户 搜索 到 。 

企业 网 站 在 推广 的 时 候 应 尽量 少 用 Flash， 站 点 间 进 行 广告 交换 时 也 要 避免 采用 Flash 
广告 。 

8. 程序 优化 

代码 设置 不 有 不 仅 会 延长 网 页 加 载 时 间 ， 也 将 严重 影响 蜘蛛 程序 对 网 页 内 容 的 抓 取 。 通 

过 对 网 页 代码 进行 清理 ， 去 掉 爱 肿 杂 乱 的 代码 ， 减 小 网 页 文件 大 小 ， 能 够 加 快 网 页 加 载 速 
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度 ， 让 蜂 蛛 快速 索引 到 重要 内 容 。 正 常情 况 下 一 个 页 面 的 文件 大 小 在 15KB 左右 , 最 好 不 要 
超过 50KB。 网 页 优化 重点 涉及 以 下 儿 个 要 点 : 

(1) CSS 样式 优化 。 网 页 制作 应 通过 CSS“〔〈 层 县 样式 表单 ) 来 统一 定制 字体 风格 ， 以 
使 代码 标准 化 ， 避 免 大 量 的 字体 和 格式 化 标签 如 < hl >< /hl >、< font size=12 color=#000000 > 
</fon 人 充斥 页 面 。 通 过 CSS 可 以 控制 任何 HTML 标签 的 风格 。 例 如 <td>,<p>,<body>,<table>， 
<tr>,<th> 等 。 只 要 在 HTML 的 <head> 区 内 的 <style type="text/css"> 和 </style> 之 则 指定 对 应 标 
签 的 风格 如 字体 、 颜 色 、 大 小 即 可 ， 例 如 网 10-8 所 示 的 优化 : 


WW で 人) 要 和 证 本 看 Mi 括 ん A(T) 直观 胡 ) 烙 基 i0) 二 条 估 ) 時点 必 ) 技 口 tm) 策動 | | 克 厅 7 所 本 本 写本 
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10-8 CSS 样式 优化 


<style type="text/css"> 
body,td,th { 
font-size: 12px; 
} 
body { 
margin-top: Opx; 


at 
font-size: 12px; 
color: #000; 
} 
a:link { 
text-decoration: underline; 
} 
a:visited { 
text-decoration: underline: 
color: #999: 
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a:hover { 
text-decoration: none; 
color: #666; 


} 

a:active 1 
text-decoration: underline; 
color: #CCC: 


} 
</style> 


仅 通 过 以 上 设置 ， 就 把 文字 的 字体 、 字 号 、 颜 色 、 背 景色 等 统一 起 来 ， 不 用 对 每 段 文字 
单独 进行 格式 定义 ， 从 而 减少 大 量 重复 性 标签 。 注 意 ， 要 把 所 有 CSS 文件 单独 存放 在 命名 
为 CSS 的 外 部 文件 中 。 通 过 设置 CSS 样式 ， 也 可 以 提升 导航 文本 的 美观 度 ， 达 到 与 图 片 导 
航 同 样 优美 观 的 效果 ， 这 点 尤其 要 提醒 网 页 设计 师 注 意 ， 没 有 必要 将 导航 条 用 图 片 呈现 。 

(2) JavaScript 等 艇 入 脚本 优化 。 正 常情 况 下 ， 网 页 尽量 以 <HTML> 作 为 代码 的 开始 
端 。 但 米 用 JavaScript 技术 的 网 页 往往 在 页 面 一 开始 就 堆积 大 量 Java 代码 ， 以 至 META 
及 关键 字 迟 迟 不 能 出 现 ， 被 推 至 页 面 底 部 ， 对 搜索 引擎 很 不 友好 。 有 两 种 方法 可 以 使 之 得 以 
改善: 

1) 将 脚本 移 至 页 面 底部 。 大 部 分 的 Java 代码 都 可 以 移 到 页 面 结束 标签 之 上 ， 而 不 影响 
网 站 功能 。 这 样 束 能 一 开始 突出 关键 学 ， 并 加 快 页 面 加 载 时 间 。 

2) 将 Java 脚本 置 入 一 个 .js 扩展 名 的 文件 。 如 图 10-9 所 示 实 例 中 首页 航 入 的 JS 文件 。 
图 10-10 所 示 的 是 首页 嵌入 的 代码 。 
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D:\shop\stryle\Article. js 




















kl 2 Var bstart = 0; 
Ss Var bstop =0; 


5 function fnTogglet) 
6 本 
7 Var next = NowImyg + 1; 


IE(mneEXt == MaxImg+l) 


NowImyg = TaxTmz 
next = 1; 


rd 2 1 Dt Ee { 


m+ 
に つ 


[ry es SE Es 
让 二 二 加 


} 
1f(bStop ! =1) 
{ 


1f(bStart == 0) 
{ 


bstart = 1; 3 iad 
setTimeoutt'fnToggle()', 3000); 
return; 

} 


else 























oTransContainer.filters[0] .applYf) : 


円 - 田 


document. images[ 'oDIV '+next].style.display = ""; 
document. images[ 'oDIV'+NowImg] . style. display = "none"; 





ぬ 上 友和 多紀 忌 洒 同 KMIE [的 


2K ア 1 秒 Unicode (UTF-8) 
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10-9 分 高 的 JS 文件 
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|——#include file=" confie. asp"——» 
<|——#include file="mairn menu. asD ——» 
“SCR src=" stylerarticle. js > SCRIF 





set rs=serwer. createobject ("adodb. recordset") 
sdl="select top 10 * from 新 闻 表 order by 新 闻 ID DESC" 
ra. open sgl, cornm, 1, 1 





图 10-10 首页 航 入 的 代码 


包含 脱 入 的 JavaScript 代码 的 js 文件 通常 在 网 站 访问 者 的 浏览 器 中 被 缓存 下 来 ， 使 得 下 
次 访问 速度 加 快 ， 也 使 得 网 站 修改 和 维护 起 来 更 加 方便 。 

例 : 

一 段 Java 代価 正常 情況 下品 示 如 下 : 





<script language=JavaScript> 

云 | 一 = 

此 处 是 JavaScript 代码 ， 找 贝 到 一 个 .js 文件 
i--> 

</script> 


忽略 开始 及 结束 标签 ， 将 中 间 的 代码 单独 保存 为 扩展 名 为 js 的 文件 ， 如 文件 名 为 
“mycode.js” 的 一 个 文件 ， 然 后 将 此 文件 上 传 到 服务 器 上 与 该 页 同样 的 目录 下 。 最 后 将 上 文 
列举 的 完整 的 JavaScript 置换 为 简单 的 一 行 : <script language=JavaScript src=mycode.js> 
</script> ， 一 个 “mycode.js” 文 件 就 将 大 段 见 长 复杂 的 Java 代码 置换 。 


1 内 部 细 书 优化 ， 

对 搜索 引擎 最 友好 的 网 页 是 静态 网 页 ， 但 大 部 分 内 容 丰 军 或 互动 型 网 站 都 不 可 避 倪 地 和 采 
用 到 相关 技术 语言 来 实现 内 容 管理 和 交互 功能 。SEO 所 强调 的 技术 文 持 ， 主 要 是 对 特定 代码 
的 优化 和 对 动态 网 页 进行 静态 处 理 的 措施 。 

1. Title 和 Meta 标签 优化 

以 .html 或 .htm 为 扩展 名 的 HTML 文档 称 为 静态 网 页 。Meta 称 为 元 标志 ， 用 于 网 页 
的 <head> 与 </head> 中 。Meta 标签 的 用 处 很 多 ， 目 前 儿 乎 所 有 的 搜索 引擎 机 右 人 都 通过 
自 効 食 Meta 值 来 给 网 页 分 类 ， 是 借 此 判断 网 页 内 容 的 基础 。 其 中 最 重要 的 是 Description 
《网 站 摘 述 ) 和 Keywords《〈 网 站 关键 词 )。 另 外 一 个 基本 的 属性 是 Title 标签 ， 提 示 搜 索引 擎 
关于 本 页 的 主题 。Meta 和 Title 的 形式 在 HTML 语言 中 体现 为 : 






































<head> 

<title>title 标题 </title> 
<meta name="keywords" > 
<meta name="description" > 


</head> 





& 管 Meta 本 身 不 足以 解决 排名 问题 ， 但 对 Meta 标签 的 书写 仍然 是 搜索 引擎 优化 的 基础 
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工作 。 清 晰 准确 的 Meta 文字 与 正文 内 容 的 关键 词 相 呼应 ， 是 排名 加 分 的 重要 条 件 之 一 。 
标题 ， 
网 页 优化 可 以 说 是 从 Title 开始 的 。 在 搜索 结果 中 ， 每 个 抓 取 内 容 的 第 一 行 显示 的 文字 
就 是 该 页 的 _Title。 同 样 ， 在 浏览 器 中 打开 一 个 页 面 ， 地 址 栏 上 方 显示 的 也 是 该 页 的 (づつ) 
Title。 因 此 ，Title 可 请 一 个 页 面 的 核心 ， 如 图 10-11 所 示 的 标题 动态 程序 就 可 以 随时 在 后 
台 实现 更 改 。 











tt itle> 

<meta http-equivw="Cornt ernt-Tipe" content=" text/html: charset=eb2312"» 
<link href=" style/index. cas” rel=" stylesheet” tvype= text/cas > 
‘script laneuaee= Javascript” tvype= text/Javrascript”» 


图 10-11 标题 优化 后 的 效果 


对 Title 的 书写 要 注意 以 下 问题 : 

(1) Title 应 简短 精练 ， 高 度 概 括 ， 含 有 关键 字 ， 而 不 是 只 有 一 个 公司 名 。 但 关键 字 不 宜 
过 多 ， 不 要 超过 3 个 词组 。 企 业 网 站 的 Title 通 单 以 公司 名 + 关键 字 为 内 容 。 

(2) 前 几 个 词 对 搜索 引擎 最 重要 ， 因 此 关键 字 位 置 义 量 靠 前 。 

(3) 最 好 将 Title 组 织 成 符合 语法 结构 和 阅读 习惯 的 短 句 或 短语 ， 避 免 无 意义 的 词组 罗 
列 式 。 

标题 天 键 字 : 

Keywords 的 作用 在 于 提示 搜索 引擎 : 本 网 站 内 容 围绕 这 些 词汇 展开 。 因 此 Keywords 书 
写 的 关键 是 每 个 词 都 能 在 内 容 中 找到 相应 的 匹配 才 有 利于 排名 。Meta 中 的 关键 学 书写 技巧 
见 前 文 鸭 “关键 字 策 略 ” 

摘 述 (Description): 

描述 部 分 用 简短 的 句子 告诉 搜索 引擎 和 访问 者 基于 本 网 页 的 主要 内 容 。 用 该 网 站 的 核心 
关键 字 搜 索 后 得 到 的 搜索 结果 中 ， 描 述 往往 显示 为 标题 后 的 几 行 描述 文字 。Description 一 般 
被 认为 重要 性 在 Title 和 Keywords 之 后 。 摘 述 的 书写 要 注意 以 下 问题 : 

(1) 描述 中 出 现 关 键 字 ， 确 保 与 正文 内 容 相 关 ; 

(2) 遵 循 筒 短 原川 , 字 符 数 含 空 格 在 内 不要 超 辻 200 个 字符 。 

2. 动态 网 页 优化 

动态 网 站 是 指 网 站 内 容 的 更 新 和 维护 是 通过 一 个 带 有 数据 库 后 台 的 软件 ， 即 内 容 管理 系 
统 (CMS) 完 成 。 一 般 采 用 ASP、PHP、Cold Fusion、CGI 等 程序 动态 生成 页 面 。 动 态 页 面 在 
网 络 空间 中 实际 并 不 存在 ， 它 们 的 大 部 分 内 容 通 利 来 目 与 网 站 相连 的 数据 库 ， 上 只 有 接 到 用 户 
的 请 求 ， 在 变量 区 中 输入 一 个 值 以 后 才 会 生成 。 动 态 网 页 扩展 名 显示 为 .asp、.php、cfm 
或 .cgi， 而 不 是 静态 网 页 的 .html 或 者 .htm。 其 URL 中 通常 出 现 “?”“=”“%”， 以 及 
“及 ”“$” 等 从 写 。 网 站 使 用 动态 技术 的 好 处 ， 除 了 增加 网 站 交互 功能 ， 还 具有 容易 维护 和 
更 新 的 优点 ， 因 此 被 许多 大 中 型 网 站 采用 。 但 大 多 数 搜索 引 敬 的 蜂 蛛 程序 都 无 法 解读 符号 
“?” 后 的 学 从 ， 这 就 意味 看 动态 网 页 很 难 被 搜索 引 敬 检索 到 ， 因 而 被 用 户 找 到 的 机 会 也 大 为 
降低 。 因 此 ， 建 设 网 站 之 前 首先 要 端正 思想 ， 即 能 够 采用 静态 表现 的 网 页 尽量 不 要 用 动态 实 
现 ， 重 要 的 网 页 用 静态 表现 。 同 时 使 用 技术 将 动态 网 页 转化 成 静态 网 页 形式 ， 使 URL 中 不 
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再 包含 “?”“=” 等 类 似 的 符号 。 也 可 以 通过 对 网 站 进行 一 些 改动 ， 间 接 增 加 动态 网 页 的 搜 
索引 擎 可 见 度 。 

针对 不 同 程序 开发 的 动态 网 页 有 看 不 同 的 解决 方案 。 

(1) CGI Perl 技术 : 如 果 网 站 中 使 用 的 是 CGI 或 者 Perl， 可 用 一 个 脚本 拾取 环境 变量 
前 的 所 有 学 符 , 再 閣 URL 中 剩余 的 字符 赋值 给 一 个 变量 。 这 样 ， 束 可 以 在 URL 中 使 用 该 
变量 了 

不 过 ， 对 于 那些 内 置 了 部 分 SSI (Server-Side Include: 服务 器 端 仍 入 ) 内 容 的 网 页 ， 主 
要 的 搜索 引擎 都 能 够 提供 索引 支持 。 那 些 以 .shtml 为 后 级 名 的 网 页 也 被 解析 成 SSI 文件 ， 相 
当 于 通常 的 .html 文件 。 但 如 果 这 些 网 页 在 其 URL 中 使 用 的 是 cgi-bin 路 径 ， 则 仍 有 可 能 不 
伏 搜索 引擎 索引 。 

(2) ASP 技术 : ASP (Active Server Pages: Web 服务 堪 问 动 态 网 页 开发 技术 ) 被 用 于 基 
于 微软 的 网 络 服务 器 中 。 使 用 ASP 开 友 的 网 页 ， 一 役 后 缀 名 为 .asp。 只 要 避免 在 URL 中 
使 用 符 写 “?”， 大 多 数 搜索 引擎 都 能 够 广 持 用 ASP 开发 的 动态 网 页 。 

(3) Cold Fusion 技术 : 使 用 Cold Fusion 就 需要 在 服务 器 端 重新 对 其 进行 配置 ， 使 其 能 
够 将 一 个 环境 变量 中 的 符 写 “?” 用 符号 “/” 代 蔡 ， 并 将 蕉 换 后 的 数值 传 给 URL。 这 样 一 
来 ， 最 后 到 达 浏 览 器 端的 就 是 一 个 静态 的 URL 页 。 当 搜索 引擎 对 该 转换 后 的 文件 进行 检索 
时 ， 它 不 会 下 遇 “?”， 因 而 可 继续 对 整个 动态 页 的 索引 ， 从 而 使 动态 网 页 对 搜索 引擎 仍然 具 
有 可 读 性 。 

(4) Apache 服务 器 : Apache 是 最 流行 的 HITP 服务 器 软件 之 一 。 它 有 一 个 叫做 
mod _ rewrite 的 重 写 模块 ， 即 URL 和 章 写 转 问 功能 。 该 模块 能 够 使 你 将 包含 环境 变量 的 URL 
转换 为 能 够 为 搜索 引擎 文 持 的 URL 类 型 。 对 于 那些 发 布 后 无 顷 多 少 更 新 的 网 页 内 容 如 新 
闻 ， 可 采用 该 重 写 转 加 功能 。 

可 以 通过 对 网 站 做 一 些 修改 ， 尽 可 能 增加 动态 网 页 的 搜索 引擎 可 见 度 。 如 将 动态 网 责编 
入 谢 态 主页 或 网 站 地 图 的 一 个 链接 中 ， 以 毅 态 目录 的 方式 呈现 该 动 页 面 。 或 者 为 动态 页 面 建 
区 一 个 专门 的 毅 态 入 口 页 面 ， 链 接 到 动态 页 面 ， 然 后 将 毅 态 入 口 页 面 递交 给 搜索 引擎 。 

对 一 些 重 要 的 、 内 容 相对 固定 的 页 面 制作 为 于 态 网 页 ， 如 包含 有 丰 蛙 关键 字 的 网 站 介 
绍 、 用 户 帮 助 ， 以 及 含有 重要 页 面 链接 的 网 站 地 图 等 。 网 站 首页 尽量 全 部 采用 静态 形式 ， 并 
将 重要 动态 内 容 以 文本 链接 方式 全 部 呈现 ， 虽 然 增加 了 维护 工作 量 ,， 但 从 SEO 的 角度 看 是 
值得 的 。 
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注重 网 页 级 别 





Google 搜索 引擎 采用 的 核心 软件 称 为 PageRank (PR)， 这 是 一 套用 于 网 页 评级 的 系 
统 ， 是 Google 搜索 排名 算法 中 的 一 个 组 成 部 分 。 评 级 的 级 别 从 1 一 10 级 ，10 级 为 满分 ，PR 
值 越 蜗 说 明 该 网 页 在 搜索 排名 中 的 地 位 越 重 要 ， 也 就 是 说 ， 在 其 他 条 件 相 同 的 情况 下 ，PR 
值 高 的 网 站 在 Google 搜索 结果 的 排名 中 有 优先 权 。 网 页 级 别 由 此 成 为 Google 所 有 网 络 搜索 
工具 的 基础 。 
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| 10.4.1 网 页 级 别 概述 ) 





一 个 PR 值 为 1 的 网 站 表明 这 个 网 站 不 太 具有 流行 度 ， 而 PR 值 为 7 一 10 则 表明 这 个 网 ( あ ) 


站 非常 受 欢迎 (或 者 说 极其 重要 )。 一 般 PR 值 达 到 4 的 网 站 ， 束 算是 一 个 不 错 的 网 站 了 。 
Google 把 目 己 的 网 站 的 PR 值 定 到 7。 如 图 10-12 所 示 的 是 Google 工具 栏 。 
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nana 控 再 | 单 与 十 情 


河 新 有 交 时 避 中 文 间 太 局 疝 位 中 误 同 可 


mg emm.hk 本 用 下 列 本 再 中 豆 工本 国 】 Erasihh 
雪上 于 博 让 到。 mg 二 是 eg ter mm Enghrwh 
瑚 至 这 卜 二 








图 10-12 Google 工具 栏 上 显示 Google 的 PR 值 为 7 

















重要 的 、 局 质量 的 网 页 会 获得 较 高 的 网 页 级 别 。Google 在 排列 其 搜索 结果 时 ， 都 会 考虑 
每 个 网 页 的 级 别 。 当 然 ， 如 采 不 能 满足 得 询 要 求 ， 网 页 级 别 再 高 也 坚 无 意义 。 因 此 ，Google 
将 网 页 级 别 与 完善 的 文本 匹配 技术 结合 在 一 起 ， 为 用 户 找到 最 重要 、 最 有 用 的 网 页 。Google 
所 关注 的 远 不 只 是 关键 字 在 网 页 上 出 现 的 次 数 ， 它 还 对 该 网 页 的 内 容 ( 以 及 该 网 页 所 链接 的 
内 容 ) 进行 全 面 检 查 ， 从 而 确定 该 网 页 是 人 否 满 足 您 的 查询 要 求 。 

PR 值 算法 原理 总 体 上 基于 下 和 面 2 个 前 提 : 

(1) 一 个 网 页 被 多 次 引用 ， 则 它 可 能 是 很 重要 的 ;一 个 网 页 昌 然 没有 被 多 次 引用 ， 但 是 
被 重要 的 网 页 引用 ， 则 它 也 可 能 是 很 重要 的 ; 一 个 网 页 的 重要 性 被 平均 的 传递 到 它 所 引用 的 
网 页 。 这 种 重要 的 网 页 称 为 权威 网 页 。 

(2) 假定 用 户 一 开始 随机 的 访问 网 页 集合 中 的 一 个 网 页 ， 然 后 跟随 网 页 的 链接 回 前 浏览 
网 页 ， 不 回 退 浏览 ， 那 么 浏览 下 一 个 网 页 的 概率 就 是 被 浏览 网 页 的 PageRank 值 。 


“影响 PR 值 因素 ) 


PR 值 体现 为 从 0 一 10 的 11 个 数值 ， 在 Google 的 工具 栏 上 以 一 条 横向 绿色 柱状 图 显 
示 , 0 级 情况 下 呈 和 白色 ， 它 是 针对 网 页 而 不 是 网 站 。 因 此 一 个 网 站 的 首页 和 内 页 往往 有 着地 
然 不同 的 PR 值 。 对 中 文 网 站 来 说 ， 拥 有 3 级 PR 是 基础 ，4 级 PR 算 达 标 ，5 级 PR 可 谓 民 
好 ， 而 6、7 级 PR 惑 算 相当 优秀 的 网 站 。 当 然 ， 由 于 PR 最 下 接 的 影响 因素 是 来 自 链 接 ， 
此 这 种 评级 并 不 代表 内 容 的 级 别 水 准 ， 网 站 内 容 质量 对 PR 的 影 啊 是 间接 的 、 长 期 的 。 根 据 
PR 值 的 算法 原理 ， 可 知 影响 一 个 网 站 (首页 ) PR 値 的 因 素 主要 包括 : 
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1. 网 站 的 导入 链接 质量 

获得 高 PR 人 需要 获得 来 目 以 下 网 站 的 链接 包括 : 

(1) 加 入 搜索 引擎 分 类 目录 ; 

(2) 与 已 经 加 入 目录 的 网 站 交换 链接 ; 

(3) 获得 来 日 PR 値 不 低 十 4 并 与 网 站 主题 相关 或 互补 的 网 站 的 链接 : 

(4) 网 站 链接 出 现在 流量 大 、 知 名 上 度 遍 、 频 索 更 新 的 重要 网 站 上 ; 

(5) 与 网 站 交换 链接 的 网 站 具有 很 少 导 出 链接 ; 

(6) 与 内 容 质量 高 的 网 站 链接 。 

2. 导出 链接 数量 

根据 PR 计算 原理 ， 由 于 “一 个 网 页 的 重要 性 被 平均 的 传递 到 它 所 引用 的 网 页 ”， 因 此 
有 反 过 来 看 ， 一 个 页 面 内 过 多 的 导出 链接 将 潜在 引起 该 页 PR 値 的 流失 。 但 稚内 容 的 角度 看 , 
适当 数量 的 与 主题 有 关联 的 导出 链接 给 搜索 引擎 市 来 民 好 的 印象 。 因 一 个 页 面 ， 尤 其 是 首页 
的 导出 链接 数量 的 把 握 ， 应 该 兼顾 到 PR 值 和 关键 词 内 容 二 者 之 间 的 平衡 ， 即 控制 导出 链接 
数量 ， 以 不 超过 10 个 为 宜 。 

3. 收录 页 面 数 量 

在 关注 核心 关键 词 排 名 以 及 首页 的 表现 情况 ， 却 往往 忽略 了 一 个 重要 的 问题 : 即 搜索 引 
擎 对 一 个 网 站 收录 的 页 面 数 量 。 后 者 在 SEO 中 也 有 看 极其 重要 的 意义 。 一 个 用 核心 天 键 字 
丛 询 排名 不 佳 的 网 站 ， 可 能 由 于 被 抓 取 大 量 网 页 而 在 用 户 使 用 其 他 关键 字 奏 询 时 ， 内 页 获得 
前 三 甲 排名 。 由 于 用 己 搜 索 时 使 用 的 关键 字 具 有 分 散 性 ， 使 得 这 种 情况 往往 给 网 站 市 来 极 大 
访问 量 。 

正 因 为 收录 页 面 的 数量 直接 影响 访问 量 ， 因 此 对 PR 值 的 影响 也 是 很 大 的 。 被 收录 页 面 
越 多 ， 主 页 PR 越 高 。 不 过 需要 强调 的 是 ， 此 处 所 指 的 数量 是 指 被 收录 数 与 网 站 页 面 总 数 的 
比值 ， 而 不 是 收录 页 面 的 绝对 数值 。 比 如 一 个 拥有 100 个 页 面 的 网 站 被 收录 了 10 个 页 面 ， 
网 站 的 被 收录 比值 是 110， 一 个 拥有 2000 个 页 面 的 网 站 被 收录 了 100 个 页 面 ， 比 值 是 
1/20， 结 果 是 收录 10 个 页 面 比 收录 100 个 页 面 的 网 站 还 更 具 排名 优势 。 

4. 首页 PR 的 高 低 

尽管 对 PR 的 界定 是 针对 网 页 而 不 是 网 站 ， 但 由 于 每 个 网 页 都 依托 茶 一 网 站 而 存在 ， 首 
页 是 推广 的 核心 页 面 ， 所 以 网 站 首页 PR 高 低 对 内 页 各 PR 也 产生 直接 影响 。 一 般 而 言 ， 一 
个 网 站 各 页 面 的 PR 值 呈现 以 下 走 同 : 首页 > 一 级 页 面 > 二 级 页 面 > 三碧 内 面 … 毎 深 人 一 
级 ，PR 降低 10-2 个 档次 。 如 果 一 个 深层 内 页 有 很 多 外 部 或 内 部 链接 ， 情 况 则 为 当 别 论 。 

5. 文件 类 型 

可 以 索引 到 的 网 页 和 文件 类 型 包括 : pdf、asp、jsp、hdml、shtml、xml、cfm、doc、 
xls、ppt、rtf、wks、lwp、wri、swf。 由 于 做 成 PDF 格 陈 的 文件 往往 都 是 网 站 比较 重要 的 内 
容 或 文章 ， 因 此 Google 默认 PDF 格式 文件 的 PR 天 生 为 3, 高 二 一 般 HTML 文件 。 同 
理 , Google 给 予 XML、PS、Word、Power Point、Excel 等 类 型 页 面 的 PR 也 比 普 通 网 页 
文件 高 。 因 此 ， 对 于 网 站 比较 有 价值 的 内 容 建 议 做 成 PDF 格式 。 

6. PR 值 的 更 新 

Google 每 个 月 进行 一 次 数据 更 新 ， 更 新 后 的 网 站 排名 和 导入 链接 都 会 有 茶 些 变化 ， 但 
其 PR 更 新 时 间 一 般 要 延迟 全 更 新 后 的 三 个 月 左右 ， 而 且 网 站 的 PR 值 相对 稳定 ， 要 上 升 或 
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下 降 一 级 PR 是 很 不 容易 的 事情 。 


证 PR 值 的 作用 


由 于 网 页 级 别 的 融 低 直接 受 链接 的 影响 ， 而 链接 仅 是 SEO 的 一 个 方面 ， 因 此 PR 的 高 > 
低 只 能 反映 出 SEO 的 部 分 效 采 。 一 个 网 页 如 来 拥有 局 PR 值 能 够 说 明 的 仅 是 网 页 比较 重要 ， 
拥有 了 排名 菲 前 的 优先 权 ， 并 不 能 与 排名 匪 前 直接 画 上 等 写 ， 搜 索引 擎 会 加 快 对 网 页 数据 的 
更新 。 
PR 值 不 高 的 网 站 同样 有 可 能 获得 好 的 排名 ， 而 PR 高 的 网 站 也 不 见得 有 理想 的 排名 。 并 
且 ， 在 这 样 的 思想 指导 下 ， 往 往 万 面 退 求 链接 效应 ， 忽 略 了 SEO 对 于 内 容 、 结 构 、 关 键 字 
等 方面 的 分 机 和 改进 ， 而 后 者 才 是 用 户 和 搜索 引擎 长 期 关注 的 焦点 。 在 SEO 的 过 程 中 ， 不 
能 起 记 内 容 建 设 ， 不 能 息 记 优质 外 链 ， 但 也 要 适当 注音 网 页 的 PR 值 。 









































Android 人 入门 与 实战 体验 
书号 : 34928 定价 : 69.80 元 
作者 : 李 佐 棚 等 
本 书 通过 实例 教学 的 方式 讲解 了 Android 


技术 在 各 个 领域 的 具体 应 用 过 程 。 全 书 分 为 16 | 
章 ，1 一 5 章 是 基础 篇 ， 讲 解 了 Android 的 发 展 前 上 E 
景 和 开发 环境 的 搭建 过 程 ; 6 一 13 章 是 核心 技术 | 
篇 ， 详 细 讲 解 了 Android 技 术 的 核心 知识 ， 并 对 | 


程序 优化 进行 了 详细 剖析 ; 14 一 16 章 是 综合 实 
战 应 用 篇 ， 通 过 3 个 综合 实例 讲解 了 Android 技 
木 常用 的 井 色 流 程 。 


追逐 App Store 的 脚步 一 一 
手机 软件 开发 者 创 富 之 路 


书号 : 35619 定价: 49.00 元 
作者 : 项 有 建 


本 书 介 绍 了 如 何 进行 软件 产品 设计 , 特别 | 
是 如 何 针对 现代 手机 软件 产品 进行 设计 ;介绍 上 
了 数字 产品 的 营销 方法 ， 特 别 是 如 何 针对 现代 | 
手机 软件 产品 进行 营销 的 方法 。 书 中 强调 了 用 
户 需求 以 及 竞争 两 个 设计 视角 , 介绍 了 “平台 辐 
射 原理 ”, 初步 解决 了 如 何 利用 公式 化 的 方法 用 
平台 推广 产品 的 问题 。 


Android 开发 案例 驱动 教程 


书号 : 35004 定价: 69.80 元 
作者 : 关东 升 
本 书 旨 在 帮助 读者 全 面 掌 握 Android 开 发 


技术 ， 能 够 实际 开发 Android 项 目 。 本 书 全 面 介 上 


绍 了 在 开源 的 手机 平台 Android 操 作 系 统 下 的 


应 用 程序 开发 技术 ， 包 括 UI、 多 线程 、 数 据 存 


储 、 多 媒体 、 云 端 应 用 以 及 通信 应 用 等 方面 。 


本 书 采用 案例 驱动 模式 展开 讲解 ， 既 可 作为 高 | 
等 学 校 的 参考 教材 , 也 适合 广大 Android 初 学 者 | 


和 Android 应 用 开发 的 程序 员 参 考 。 


Windows Phone 7 完美 开发 征程 
书号 : 34043 ”定价 : 43.00 元 
作者 : 倪 洗 

本 书 以 全 新 的 Windows Phone 7 手机 应 用 

程序 开发 为 主题 ， 采 用 理论 和 实践 相 结合 的 方 | 
法 ， 由 浅 入 深 地 讲述 了 新 平台 的 基础 架构 、 开 | 
发 环境 、 图 形 图 像 处 理 、 数 据 访问 、 网 络 通信 上 [ 
等 知识 点 。 最 后 通过 较为 完整 的 实战 演练 ， 帮 | 
助 读者 更 快 地 掌握 项 目 开发 的 各 个 技术 要 点 ， | 
使 读者 能 够 尽快 投入 到 实际 项 目的 开发 。 


从 实例 走 进 OPhone 世 界 


书号 : 33030 定价; 45.00 元 
作者 : 周 轩 

本 书 从 一 个 开发 者 的 角度 出 发 ， 介 绍 了 
OPhone/Android 系 统 的 基础 知识 和 开发 技巧 ， 
详细 讲解 了 无 线 通信 、 娱 乐 游戏 、 移 动 生 活 、 
OPhone 特 色 应 用 等 多 种 类 型 程序 的 开发 流程 | 
和 方法 ， 通 过 介绍 系统 自 带 源 代码 实例 ， 为 读 | 
者 提供 参考 资料 和 分 析 素 材 。 本 书 配 有 大 量 插 | 
图 和 代码 注释 ， 为 自学 者 提供 了 方便 。 | 


Qt 开发 Symbian 应 用 权威 指南 
书号 : 36089 ”定价 : 45.00 元 
作者 : Fitzek 等 译 者 : DevDiv 移动 开发 社区 | 
本 书 主要 是 向 读者 介绍 如 何在 Symbian 上 | 
快速 有 效 地 创建 Qt 应 用 程序 。 全书 共 分 7 章 , 包 | 
括 开发 入 门 、Qt 概 述 、Qt Mobility APIs、 类 Qt | 
移动 扩展 、 Qt 应 用 程序 和 Symbian 本 地 扩展 、 | 
Qt for Symbian 范例 。 | 
本 书 可 作为 移动 设备 开发 领域 的 初学 者 和 | 
专业 人 员 的 参考 用 书 ， 也 可 作为 手机 开发 基础 | 
课程 的 教材 。 | 
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9: 00~10 : 00 一 一 从 井井有条 开始 

10 : 00~11 :00 一 一 网 络 化 商务 沟通 
11 : 00-12 : 00 一 一 商务 参考 好 帮手 
13 : 00~14 :00 一 一 商务 文档 的 制作 
14 : 00~15 : 00 一 一 商务 会 议 中 的 iPad 
15 : 00~ 16 : 00 一 一 打造 商务 备 忘 

16 : 00~17 : 00 一 一 云端 商务 
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